ANASAYFA

Yatay Açılır Menü Yapımı (HTML-CSS )

Yatay açılır menü nasıl yapılır bu yazımızda buna değindim umarım beğenirsiniz …

[responsivevoice_button voice="Turkish Male"]

Yatay Açılır Menü Nasıl Yapılır ?

Herkese merhaba dostlar bu yazımız’da Html ve Css ile yatay açılır menü yapacağız umarım beğenirsiniz <3

Youtube Kanalımız

Kodlar

HTML:

<html>
<head>
<title></title>
</head>
<body>
<ul>
  <li><a href="#index">Ana sayfa</a></li>

  <li><a href="#hakkımızda">Hakkımızda</a></li>

  <li><a href="#Ders">Ders</a>
   <ul>

      <li><a href="#php">php</a></li>

      <li><a href="#css">css</a></li> 

      <li><a href="#html">html</a></li>      
    </ul>

    </li>

  <li><a href="#referanslar">Referanslar</a></li>

  <li><a href="#iletisim">İletişim</a></li>
</ul>
</body>
</html>

CSS

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #34495e;
}

li {
    display:inline-block;
}

li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover{
    background-color:#f39c12; 
}

ul li ul {
    background-color:#2c3e50;
    display:none;
    position:absolute;
    width:100px
}

ul li:hover ul{
    display:block;
}
li ul li {
    display:block; 
}

Umarım beğenirsiniz arkadaşlar… <3

[Toplam: 1   Ortalama: 5/5]
To Top