Çözüldü HTML liste öğelerine resim ekleme
Bu konu çözüldü olarak işaretlenmiştir. Çözülmediğini düşünüyorsanız konuyu rapor edebilirsiniz.
Çözüm
CSS Kodumuz – 1. Yöntem “li” Etiketini Biçimlendirmek
Aşağıdaki kod ile yapmış olduğumuz olay listeleme etiketinin standart liste tipini iptal edip (list-style-type:none
, istediğimiz bir arkaplan resmi atamak ve bunu en sola dayamak.[css]#sen ul li {
list-style-type:none;
background:url(../resimler/ikon.gif) left center no-repeat;
padding:5px 0px 5px 25px;
}
#sen ul li:hover {
background:url(../resimler/ikon2.gif) left center no-repeat ;
}
#sen ul li a {
text-decoration:none;color: #006400;
}
#sen ul li a:hover {
color:#666666;
}[/css]
ahmet_kıran
Hectopat
CSS Kodumuz – 1. Yöntem “li” Etiketini Biçimlendirmek
Aşağıdaki kod ile yapmış olduğumuz olay listeleme etiketinin standart liste tipini iptal edip (list-style-type:none, istediğimiz bir arkaplan resmi atamak ve bunu en sola dayamak.[css]#sen ul li {
list-style-type:none;
background:url(../resimler/ikon.gif) left center no-repeat;
padding:5px 0px 5px 25px;
}
#sen ul li:hover {
background:url(../resimler/ikon2.gif) left center no-repeat ;
}
#sen ul li a {
text-decoration:none;color: #006400;
}
#sen ul li a:hover {
color:#666666;
}[/css]
Son düzenleme:
KS
KS
Jarvis0
Hectopat
- Katılım
- 8 Eylül 2019
- Mesajlar
- 134
CSS kodumuz – 1. yöntem “li” etiketini biçimlendirmek
Aşağıdaki kod ile yapmış olduğumuz olay listeleme etiketinin standart liste tipini iptal edip (list-style-type: None
[css]#sen ulli {
List-style-type: None;
background:url(../resimler/ikon.gif) left Center no-repeat;
Padding: 5px 0px 5px 25px;
}
#Sen ulli: Hover {
background:url(../resimler/ikon2.gif) left Center no-repeat;
}
#Sen ulli a {
Text-decoration: None; color: #006400;
}
#Sen ulli a: Hover {
Color:#666666;
}[/css]
Çok teşekkür ederim.
ahmet_kıran
Hectopat
Sorunun çözüldü mü?
