Bir hr öğesinin rengini değiştirme

CSS kullanarak hr etiketimin rengini değiştirmek istiyorum. Aşağıda denediğim kod işe yaramıyor gibi görünüyor:

hr {
    color: #123455;
}
Uwe Keim
Edited question 2018ösp22ös13 Aralık 2018 в 1:22
Programlama
html css
2011ööp15öö6 Haziran 2011 в 6:15
30 görünümler
Çözüm

Eğer amacınız <hr> etiketi tarafından üretilen çizginin rengini değiştirmekse, color yerine border-color kullanmanız gerektiğini düşünüyorum.

Bununla birlikte, yorumlarda, çizginizin boyutunu değiştirirseniz, kenarlığın yine de stillerde belirttiğiniz kadar geniş olacağı ve çizginin varsayılan renkle doldurulacağı belirtilmiştir (bu çoğu zaman istenen bir etki değildir). Dolayısıyla, bu durumda (@Ibu'nun cevabında önerdiği gibi) `background-color'u da belirtmeniz gerekecek gibi görünüyor.

HTML 5 Boilerplate projesi varsayılan stil sayfasında aşağıdaki kuralı belirtir:

hr { display: block; height: 1px;
    border: 0; border-top: 1px solid #ccc;
    margin: 1em 0; padding: 0; }

SitePoint tarafından kısa bir süre önce yayınlanan "12 Little-Known CSS Facts" başlıklı bir makalede, hr { border-color: inherit } belirtmeniz halinde <hr>nin border-color özelliğini ebeveyninin color özelliğine ayarlayabileceğinden bahsedilmektedir.

Anton Strogonoff
Edited answer 2019ööp32öö10 Nisan 2019 в 10:32
Yorumlar (5)
 
hr
{
Renkli: #f00;
arka plan rengi: #f00;
yükseklik: 5px;
}
Yorumlar (0)
 
hr
{
  background-color: #123455;
}

değiştirmeye çalışmanız gereken arka plan

Kenarlık rengiyle de çalışabilirsiniz. bununla ilgili çapraz tarayıcı sorunları olduğunu düşündüğümden emin değilim. farklı tarayıcılarda test etmelisiniz

Yorumlar (5)