---恢复内容开始---

原理是：鼠标移上去，有个事件，拉出两个东西。

首先是写一个div

<div id="daohanglan">

<div style="mangin-top:35px">与导航栏并列，写内容。位置需要定位</div>

然后 再写几个按钮div

      <div class="annui">新闻1</div>

      <div class="annui">新闻2</div>

      <div class="annui">新闻3</div>

</div>

然后再写全局的样式

<style>

*{ mangin:0px;

    padding:0px;

}

#daohanglan{height:30px;

    border:1px solid blue;

    width:280px;

position:absolute;

top:0px;

}

.annui{

float:left;

width:70px;

max-height:30px;

background-color:black;

text-alingn:center;

line-height:30px;

overflow:hidden;

 }

ul{

list-style:none;

}

li{

background-color:red;

display:none;

}

.anniu:hover{

display:bloak;

max-height:30px;

}

</style>

然后再写按钮中的内容,每一个按钮都写内容。

<ul>

<li></li>

<li></li>

<li></li>

</ul>

---恢复内容结束---

下拉菜单