To jest mój pierwszy wpis do Stack Overflow i nie znam regulaminu forum z publikowaniem. Proszę więc poinformować mnie o wszystkim, co zrobiłem źle. Zbadałem ten problem na forach i nic, co napotkałem, daje mi jasną odpowiedź.Menu rozwijane html css
Próbuję utworzyć menu rozwijane z elementu "Wiadomości", ale nigdy nie uzyskuję żadnych widocznych wyników podczas uruchamiania kodu. Próbowałem zmienić wartość .dropdown-content
na , aby zobaczyć, czy spowodowałoby to wyświetlenie listy, ale nic nie pokazało. czego mi brakuje?
body{
\t background-image: url("images/seamless-panda-bear-pattern.jpg");
\t font-size: 100%;
\t width: 80%;
\t margin: auto;
\t font-family: Palatino,"Palatino", Arial;
}
#top{
\t background-color: black;
\t color: white;
\t padding-left: 10px;
\t border: 2px solid white;
\t font-family: Copperplate,"Copperplate Gothic Light",fantasy;
\t opacity: 0.85;
\t padding-left: 25px;
}
#menu{
\t list-style-type: none;
\t margin: 0;
\t padding: 0;
\t overflow: hidden;
\t background-color: #333;
\t position: fixed;
\t width: 80%;
}
li{
\t float: left;
}
#login{
\t float: right;
\t padding-right: 20px;
}
li a{
\t display: block;
\t color: white;
\t text-decoration: none;
\t text-align: center;
\t padding: 14px 16px;
}
li a:hover{
\t background-color: white;
\t color: black;
}
li.dropdown{
\t display: inline-block;
}
.dropdown-content{
\t display: none;
\t position: absolute;
\t background-color: #f9f9f9;
\t min-width: 160px;
\t box-shadow: 0px 8px 16px 0px rgba(0,0,0,0,2);
\t padding: 12px 16px;
\t z-index: 1;
}
.dropdown-content a{
\t display: block;
\t text-decoration: none;
\t padding: 12px 16px;
\t color: black;
}
.dropdown:hover .dropdown-content{
\t display: block;
}
#bio{
}
#bottom{
}
<div id="nav">
<ul style="list-style-type: none" id="menu">
\t <li><a href="home.html">Home</a></li>
\t <li class="dropdown"><a class="dropbtn" href="#">News</a>
\t \t <div class="dropdown-content">
\t \t \t <a href="#">Games</a>
\t \t \t <a href="#">Web Design</a>
\t \t \t <a href="#">Travel</a>
\t \t </div>
\t </li>
\t <!-- create a link to a part of the same page for contact info -->
\t <li><a href="#bottom">Contact info</a></li>
\t <li id="login"><a href="login.html">Log In</a></li>
</ul>
</div>
co chcesz zrobić? – mmativ
Po uruchomieniu fragmentu kodu działa on tak, jak chcesz, czy jest coś, czego mi brakuje? P.S. twój wpis jest WIELKI! –
Rzeczywiście zrobiłeś to, czego większość ludzi nie dostarczyło i dostarczyło wystarczającą ilość kodu. YAY !!! Działa też w mojej przeglądarce, CHROME. – Velocibadgery