console
<body>
<div>
<ul>
<li><a style="background-color:#008800" href="#">首页</a></li>
<li class="dropdown"><a class="dropbtn">C/C++</a>
<div class="dropdown-content">
<a href="http://www.runoob.com">语法篇</a>
<a href="http://www.runoob.com">实践篇</a>
<a href="http://www.runoob.com">示例代码</a>
</div></li>
<li class="dropdown"><a class="dropbtn" href="#">C#</a>
<div class="dropdown-content">
<a href="http://www.runoob.com">语法篇</a>
<a href="http://www.runoob.com">WinForm</a>
<a href="http://www.runoob.com">Web</a>
</div></li>
<li class="dropdown"><a class="dropbtn" href="#">SQL Server</a>
<div class="dropdown-content">
<a href="http://www.runoob.com">语法篇</a>
<a href="http://www.runoob.com">WinForm</a>
<a href="http://www.runoob.com">Web</a>
</div></li>
<li class="dropdown"><a class="dropbtn" href="#">Html</a>
<div class="dropdown-content">
<a href="http://www.runoob.com">语法篇</a>
<a href="http://www.runoob.com">WinForm</a>
<a href="http://www.runoob.com">Web</a>
</div></li>
<li class="dropdown"><a class="dropbtn" href="#">CSS</a>
<div class="dropdown-content">
<a href="http://www.runoob.com">语法篇</a>
<a href="http://www.runoob.com">WinForm</a>
<a href="http://www.runoob.com">Web</a>
</div></li>
</ul>
</div>
</body>
.p1{
}
body{
text-align:center;
background-color:white;
}
ul
{
list-style-type:none;
margin:0;
padding:0;
}
a
{
text-decoration:none;
padding:20px;
display:block;
width:90px;
height:30px;
color:white;
background-color:#b22222;
}
.dropdown-content a{
background-color:white;
}
a:hover{background-color:#cc0000;}
li{
font-size:20px;
float:left;
}
.dropbtn {
padding:20px;
display:block;
width:90px;
font-size:20px;
color:white;
border: none;
cursor: pointer;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color:#f9f9f9;
min-width: 90px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown-content a:hover {background-color: #f1f1f1}
.dropdown:hover .dropdown-content {
display: block;
}