Kenarlık kısayolu

border kısayolu ile tek satırda kenarlık yazarsın.

border kısayolu

Üç özelliği tek tek yazmak yerine border kısayoluyla bir satırda toplayabilirsin. Tipik biçim: border: 2px solid #333. Burada kalınlık, tip ve renk sırasıyla verilir.

Sıra aslında esnektir; tarayıcı her değeri tipine göre tanır. Ancak okunabilirlik için kalınlık - tip - renk sırası yaygındır. Atlanan değerler varsayılanı alır; örneğin renk yazılmazsa metin rengi kullanılır.

Değerleri tanımak

Kısayoldaki her değer belirli bir tipe aittir. Piksel veya rem gibi uzunluklar kalınlıktır; solid, dashed gibi anahtar sözcükler çizgi tipidir; renk adları, hex ya da rgb() değerleri renktir.

Tarayıcı bu ayrımı tipine göre yapar; bu yüzden border: solid 2px #333 de geçerlidir. Yine de ekip içinde tutarlı bir sıra seçmek kodu okumayı kolaylaştırır.

Uygulama Karta kenarlık ekle

.card seçicisi için bir bildirim bloğu yaz. İçine border: 1px solid #ccc bildirimini ekle. Kısayol tek satırda kalınlık, tip ve renk verir.

Örnek çözümü göster

/* kart kenarlığı */
.card {
  border: 1px solid #ccc;
}

Kendini test et

Hangi kullanım kenarlığın kalınlığını, tipini ve rengini açıkça belirtir?
- border: solid;
- border: 2px;
- border: 2px solid #333;
- border: #333;
Cevabı göster

border: 2px solid #333; — Doğru. 2px kalınlığı, solid tipi, #333 rengi açıkça verilir.

Kısayol özelliğini yaz

.note {
  ____: 1px solid #999;
}

Cevabı göster

.note {
  border: 1px solid #999;
}

border: 2px solid #333 değerlerini eşleştir

2px

Kalınlık
solid

Çizgi tipi
#333

Renk

Sıradaki ders: Köşe yarıçapı

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler