Tüm Araçlar
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al
lostyazilim
tr.link

HTML CSS Menü Sorunu

 11 Mesajlar 1.982 Okunma
acebozum
tr.link

#1
TheExp3rT TheExp3rT Üyeliği Durdurulmuş Banlı Kullanıcı
  • Üyelik 15.12.2013
  • Yaş/Cinsiyet 34 / E
  • Meslek Webmaster
  • Konum Almanya
  • Ad Soyad D** Ö**
  • Mesajlar 140
  • Beğeniler 34 / 13
  • Ticaret 0, (%0)
ör.wmaraci.com da menünün üstüne gelince arkaplan beyaz oluyor benim yaptıgım menüde ise sadece yazının arkaplanı beyaz oluyor neden böyle bu sorunu nasıl çözerim ?
 

 

elektronikssl
webimgo

#2
mustafanart mustafanart WM Aracı Kullanıcı
  • Üyelik 06.11.2013
  • Yaş/Cinsiyet 36 / E
  • Meslek Grafiker
  • Konum Ankara
  • Ad Soyad M** P**
  • Mesajlar 189
  • Beğeniler 2 / 53
  • Ticaret 0, (%0)
Yazıyı div yada li içine al ve :hover ver. Örnek gösterebileceğimiz yer varsa ve konuya yazarsan herkes faydalanır.
 

 

http://bit.ly/1dY0Cf6

#3
TheExp3rT TheExp3rT Üyeliği Durdurulmuş Banlı Kullanıcı
  • Üyelik 15.12.2013
  • Yaş/Cinsiyet 34 / E
  • Meslek Webmaster
  • Konum Almanya
  • Ad Soyad D** Ö**
  • Mesajlar 140
  • Beğeniler 34 / 13
  • Ticaret 0, (%0)

mustafanart adlı üyeden alıntı

Yazıyı div yada li içine al ve :hover ver. Örnek gösterebileceğimiz yer varsa ve konuya yazarsan herkes faydalanır.


#ustmenu {
background-color: #333333;
height: 58px;
margin: 20px 0px 0px 0px;
left: 0;
right: 0;
position: absolute;
}

#ustmenu ul {
width: 960px;
margin: 20px auto 20px;
color: #366066;
}
#ustmenu ul li{
list-style:none;
float:left;
padding: 0px 10px;
}
#ustmenu ul li a{
display:block;
line-height:15px;
text-decoration: none;
color: #fff;
}

#ustmenu ul li a:hover{
background: #f00;
}

 

 

#4
mustafanart mustafanart WM Aracı Kullanıcı
  • Üyelik 06.11.2013
  • Yaş/Cinsiyet 36 / E
  • Meslek Grafiker
  • Konum Ankara
  • Ad Soyad M** P**
  • Mesajlar 189
  • Beğeniler 2 / 53
  • Ticaret 0, (%0)
Dediğim gibi a'ya hover vermek yerine li'ye hover verin;

#ustmenu ul li:hover{
background: #f00;
}

içine color eklersen de a'nın rengi değişir üzerine gelindiğinde;

#ustmenu ul li:hover{
background: #f00;
color:#fff;
}

gibi
 

 

http://bit.ly/1dY0Cf6
wmaraci
wmaraci

#5
Morfran Morfran Hi again. Kullanıcı
  • Üyelik 06.03.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Tasarım, Yazılım
  • Konum İstanbul Avrupa
  • Ad Soyad V** Ç**
  • Mesajlar 763
  • Beğeniler 106 / 172
  • Ticaret 16, (%100)
#ustmenu {
background-color: #333333;
height: 58px;

margin: 20px 0px 0px 0px;
left: 0;
right: 0;
position: absolute;
}

#ustmenu ul {
width: 960px;
margin-top:0px;
color: #366066;
}
#ustmenu ul li{
list-style:none;
float:left;
padding: 0px 10px;
}
#ustmenu ul li a{
display:block;
padding:19px 10px ;
text-decoration: none;
color: #fff;
}

#ustmenu ul li a:hover{
background: #f00;
padding:19px 10px ;
}



Sağlıklı bir yöntem değil daha sağlıklısı için height değeri verebilirsin padding yerine. ama texti ortalamak amacıyla böyle yaptım.


mustafanart adlı üyeden alıntı

Dediğim gibi a'ya hover vermek yerine li'ye hover verin;

#ustmenu ul li:hover{
background: #f00;
}

içine color eklersen de a'nın rengi değişir üzerine gelindiğinde;

#ustmenu ul li:hover{
background: #f00;
color:#fff;
}

gibi



Bu yöntem daha sağlıklıdır.
 

 

#6
easlanhan easlanhan WM Aracı Kullanıcı
  • Üyelik 14.11.2013
  • Yaş/Cinsiyet 35 / E
  • Meslek Private Sector
  • Konum Malatya
  • Ad Soyad E** A**
  • Mesajlar 819
  • Beğeniler 1 / 211
  • Ticaret 0, (%0)
#ustmenu ul li a:hover{
background: #f00;
}

bunun yüzünden, alın bunu içeri :D
 

 

#7
TheExp3rT TheExp3rT Üyeliği Durdurulmuş Banlı Kullanıcı
  • Üyelik 15.12.2013
  • Yaş/Cinsiyet 34 / E
  • Meslek Webmaster
  • Konum Almanya
  • Ad Soyad D** Ö**
  • Mesajlar 140
  • Beğeniler 34 / 13
  • Ticaret 0, (%0)
Sağlıklı değil derken ? ne gibi sorun yaratır .
 

 

#8
Morfran Morfran Hi again. Kullanıcı
  • Üyelik 06.03.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Tasarım, Yazılım
  • Konum İstanbul Avrupa
  • Ad Soyad V** Ç**
  • Mesajlar 763
  • Beğeniler 106 / 172
  • Ticaret 16, (%100)

TheExp3rT adlı üyeden alıntı

Sağlıklı değil derken ? ne gibi sorun yaratır .


Font değişimine göre büyüklüğüne ya da padding değerini değiştirmeniz gerekebilir tarayıcı farklı algılayabilir vs vs. Ancak standarttır moz, chrome siz deneyin.
 

 

#9
TheExp3rT TheExp3rT Üyeliği Durdurulmuş Banlı Kullanıcı
  • Üyelik 15.12.2013
  • Yaş/Cinsiyet 34 / E
  • Meslek Webmaster
  • Konum Almanya
  • Ad Soyad D** Ö**
  • Mesajlar 140
  • Beğeniler 34 / 13
  • Ticaret 0, (%0)
Tamam Teşekkürler . Son Sorum

#ustmenu {
background-color: #2D313C;
height: 58px;
margin: 20px 0px 0px 0px;
left: 0;
right: 0;
width: 100%;
position: absolute;
}

#ustmenu ul {
width: 960px;
margin: 20px auto 20px;
color: #366066;
}
#ustmenu ul li{
list-style:none;
float:left;
padding: 0px 10px;
}
#ustmenu ul li a{
display:block;
line-height:15px;
text-decoration: none;
color: #fff;
}

#ustmenu ul li a:hover{
color: #f00;
}

Bu Sorun Yaparmı ? ve benim çözünürlük farklı baskasınınki farklı hepsinde tek 1 çözünürlük kullanılırmı yani otomatik ayarlanırm css ile ?
 

 

#10
mustafanart mustafanart WM Aracı Kullanıcı
  • Üyelik 06.11.2013
  • Yaş/Cinsiyet 36 / E
  • Meslek Grafiker
  • Konum Ankara
  • Ad Soyad M** P**
  • Mesajlar 189
  • Beğeniler 2 / 53
  • Ticaret 0, (%0)
Bu kodları kullanırsan daha sağlıklı olur menü, demo linki de ekledim alta;
#ustmenu {
background-color: #333333;
height: 58px;
left: 0;
right: 0;
position: absolute;
}

#ustmenu ul {
margin:0 auto;
width: 960px;
height: 58px;
color: #366066;
}
#ustmenu ul li{
list-style:none;
height: 58px;
float:left;
padding: 0px 10px;
}
#ustmenu ul li a{
display:block;
line-height:58px;
text-decoration: none;
color: #fff;
}

#ustmenu ul li:hover{
background: #f00;
}



demo
TheExp3rT

kişi bu mesajı beğendi.

http://bit.ly/1dY0Cf6
İngilizce Ödevi için yardım.
3 Ocak bc.vc ödeme alan
wmaraci
wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
 
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al