我的网站有一个菜单,如何让它也下拉?导航栏是我在 ccvg(dot)net 上的虚拟航空公司的导航栏
我们想让它向下下降,这样我们就可以在那里放置其他东西,比如关于页面。等等
这是它的 CSS:
#bar {
position:fixed;
top:0;
left:0;
background:#fff url(images/barlogo.png) no-repeat 10px 50%;
border-bottom:1px solid #999;
height:48px;
width:100%;
z-index:2;
font-family:Corbel, sans-serif;
font-weight:bold;
font-size:14px;
}
#bar .btn {
float:right;
height:100%;
border-left:1px solid #999;
text-transform:uppercase;
}
#bar .btn a {
display:table-cell;
width:100%;
height:45px;
padding:0 20px;
vertical-align:middle;
text-decoration:none;
color:#999;
border-top:3px solid #fff;
}
#bar .btn a:hover, #bar .btn a.selected {
background-color:#e6e6e6;
color:#5c5c5c;
}
#bar .btn img {
border:0;
vertical-align:middle;
}
#bar .btn .value {
vertical-align:middle;
padding-left:14px;
font-family:Arial, sans-serif;
font-weight:normal;
font-size:20px;
}
#bar .icon{
background-position:0 0;
display:inline-block;
vertical-align:middle;
margin:0;
}
#barmenu {
position:fixed;
width:250px;
right:0;
top:48px;
background:#fff;
border-left:1px solid #999;
border-bottom:1px solid #999;
font-size:8pt;
font-family:Verdana;
font-weight:normal;
z-index:1;
display:none;
}
#btn_menu:hover~#barmenu, #barmenu:hover {
display:block;
}
#barmenu a {
display:block;
padding:10px;
text-decoration:none;
color:#5c5c5c;
border-top:1px solid #999;
}
#barmenu a:hover {
background:#e6e6e6;
}
这是制作简单按钮按钮的 HTML。
<div class="bar"><div class="btn"><a href="<?php echo url('/'); ?>" title="Homepage" style="border-color: #40E0D0;">Homepage</a></div></div>
最佳答案
我认为您需要 HTML 标记。以下示例来自 w3schools,即 http://www.w3schools.com/tags/tag_select.asp
<!DOCTYPE html>
<html>
<body>
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
</body>
</html>
关于html - 如何在菜单外制作下拉框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27346733/