lostyazilim

CSS Yatay Menü Sorunu

10 Mesajlar 1.591 Okunma
lstbozum
wmaraci reklam

Athynas Athynas WM Aracı Kullanıcı
  • Üyelik 31.01.2015
  • Yaş/Cinsiyet 37 / E
  • Meslek Gazeteci
  • Konum İzmir
  • Ad Soyad O** D**
  • Mesajlar 445
  • Beğeniler 39 / 102
  • Ticaret 6, (%100)
asfafas
 

 

wmaraci
reklam

tahsinyaman tahsinyaman WM Aracı Telefon Onaysız
  • Üyelik 27.09.2016
  • Yaş/Cinsiyet 37 / E
  • Meslek Sistem Uzmanı
  • Konum İzmir
  • Ad Soyad T** Y**
  • Mesajlar 339
  • Beğeniler 114 / 117
  • Ticaret 1, (%100)
Buradaki .dropdown yazan alanlara kendi class adını verebilirsin.

bu tarz sorunlarda w3 schools çok işe yarıyor. hayat kurtarıyor diyebiliriz. bi göz atmanızda fayda var.

http://www.w3schools.com/css/css_dropdowns.asp bu adres üzerinde 3 farklı örnek gösterilmiş. 2. örnek senin istediğin yapıda.
 

 

Athynas Athynas WM Aracı Kullanıcı
  • Üyelik 31.01.2015
  • Yaş/Cinsiyet 37 / E
  • Meslek Gazeteci
  • Konum İzmir
  • Ad Soyad O** D**
  • Mesajlar 445
  • Beğeniler 39 / 102
  • Ticaret 6, (%100)
tahsinyaman ul ve li ler birbirine çok girdi beceremedim, tekrar deneyeceğim mesai bitiminde.
 

 

MuhammetKoc MuhammetKoc muhammetkoc.com Kullanıcı
  • Üyelik 15.03.2016
  • Yaş/Cinsiyet 27 / E
  • Meslek web tasarım
  • Konum Nevşehir
  • Ad Soyad M** K**
  • Mesajlar 215
  • Beğeniler 88 / 36
  • Ticaret 2, (%100)

ul.nav ul li {
position:relative;
list-style:none;

}
ul.nav ul li a {
display:block;
padding: 7px 12px;
color: #fff;
font-size:14px;
}

ul.nav> li:hover >ul {
top: 50px;
visibility:visible;
opacity: 1;

}

Kodlarınızın arasına bunu eklediğinizde açılır menü çalışacaktır.

https://codepen.io/muhammedkoc/pen/vKyybg bu örneğe bakarak daha iyi anlayacaksınızdır.


WordPress Menü olarak kullanacağınızı düşündüğümden dolayı o WordPress otomatik menü için .menu ulan bir ul kullanıyor ve bu mantıkla sizin ul içindeki lilere müdahale etmeniz yani class atamanız biraz zor olacaktır aşağıdaki kodları kullandığınızda bu sorunun önünü aşmış ve döngüye sokmuş oluyorsunuz 5 tane renk atadıktan sonra sürekli şekilde bu döngü dönecektir.

.menu>li:nth-child(1n)>a{
border-bottom: 6px solid #d31717;
}
.menu>li:nth-child(1n)>a:hover{
background-color: #d31717;
color: #FFF;
transition: background-color .2s, color .2s;
}
.menu>li:nth-child(2n)>a{
border-bottom: 6px solid #17d3a5;
}
.menu>li:nth-child(2n)>a:hover{
background-color: #17d3a5;
color: #FFF;
transition: background-color .2s, color .2s;
}
.menu>li:nth-child(3n)>a{
border-bottom: 6px solid #E88447;
}
.menu>li:nth-child(3n)>a:hover{
background-color: #E88447;
color: #FFF;
transition: background-color .2s, color .2s;
}
.menu>li:nth-child(4n)>a{
border-bottom: 6px solid #6cd122;
}
.menu>li:nth-child(4n)>a:hover{
background-color: #6cd122;
color: #FFF;
transition: background-color .2s, color .2s;
}

.menu>li:nth-child(5n)>a{
border-bottom: 6px solid #AB40E8;
}
.menu>li:nth-child(5n)>a:hover{
background-color: #AB40E8;
color: #FFF;
transition: background-color .2s, color .2s;
}



wordpress açılır menü için takipteyim :)
 

 

muhammetkoc.com
wmaraci
wmaraci

Athynas Athynas WM Aracı Kullanıcı
  • Üyelik 31.01.2015
  • Yaş/Cinsiyet 37 / E
  • Meslek Gazeteci
  • Konum İzmir
  • Ad Soyad O** D**
  • Mesajlar 445
  • Beğeniler 39 / 102
  • Ticaret 6, (%100)
MuhammetKoç akşam deneyip döneceğim :)
MuhammetKoc

kişi bu mesajı beğendi.

MuhammetKoc MuhammetKoc muhammetkoc.com Kullanıcı
  • Üyelik 15.03.2016
  • Yaş/Cinsiyet 27 / E
  • Meslek web tasarım
  • Konum Nevşehir
  • Ad Soyad M** K**
  • Mesajlar 215
  • Beğeniler 88 / 36
  • Ticaret 2, (%100)
athynas galiba işinizi gördü
 

 

muhammetkoc.com

tahsinyaman tahsinyaman WM Aracı Telefon Onaysız
  • Üyelik 27.09.2016
  • Yaş/Cinsiyet 37 / E
  • Meslek Sistem Uzmanı
  • Konum İzmir
  • Ad Soyad T** Y**
  • Mesajlar 339
  • Beğeniler 114 / 117
  • Ticaret 1, (%100)
Bence arkadaş denemeyi bıraktı :S
 

 

Athynas Athynas WM Aracı Kullanıcı
  • Üyelik 31.01.2015
  • Yaş/Cinsiyet 37 / E
  • Meslek Gazeteci
  • Konum İzmir
  • Ad Soyad O** D**
  • Mesajlar 445
  • Beğeniler 39 / 102
  • Ticaret 6, (%100)
MuhammetKoç Denemeye fırsat bulamadım nispeten tahsinyaman da haklı deneyince yazacağım. Çok yoğunum dönüş de yapamadım özür dilerim bunun için
 

 

tahsinyaman tahsinyaman WM Aracı Telefon Onaysız
  • Üyelik 27.09.2016
  • Yaş/Cinsiyet 37 / E
  • Meslek Sistem Uzmanı
  • Konum İzmir
  • Ad Soyad T** Y**
  • Mesajlar 339
  • Beğeniler 114 / 117
  • Ticaret 1, (%100)
athynas hocam est. özür dilenecek konu değil. sadece merak ettik sonuca varabildinmi diye.
 

 

MuhammetKoc MuhammetKoc muhammetkoc.com Kullanıcı
  • Üyelik 15.03.2016
  • Yaş/Cinsiyet 27 / E
  • Meslek web tasarım
  • Konum Nevşehir
  • Ad Soyad M** K**
  • Mesajlar 215
  • Beğeniler 88 / 36
  • Ticaret 2, (%100)
tahsinyaman aynen bende fazla merak ettim :D
 

 

muhammetkoc.com
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