帅气的菜单

最新推荐文章于 2021-02-03 20:05:27 发布

ibogood

最新推荐文章于 2021-02-03 20:05:27 发布

阅读量407

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/ibogood/article/details/8279504

版权

javascript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language="javascript" src="jquery.min.js"></script>
<style>
.clear{
  clear:both;
}
* li{
  list-style:none;
}
* a{
  text-decoration:none;
}
#head{
  width:990px;
  margin:0 auto;
}
#head img{
  float:left;
}
#navbg{
  width:100%;
  height:47px;
background:url(http://www.huawei.com/cn/ucmf/groups/public/documents/webasset/hw_s_221828.jpg);
}
#nav{
  width:990px;
  margin:0 auto;
}
#nav a{
  float:left;
  display:block;
  height:47px;
  padding:0 25px;
  line-height:47px;
  text-decoration:none;
  color:#666666;
}
#nav a:hover{
  background-image: url(http://www.huawei.com/cn/ucmf/groups/public/documents/webasset/hw_s_232053.png);
  background-repeat: no-repeat;
  background-position: 100% -18px;
  background-color: transparent;
  color: #B00;
  text-shadow: white 1px 1px 0px;
}
#menu{
  width:990px;
  margin:0 auto;
  margin-top:-1px;
  border:1px solid #dcdcdc;
  position:relative;
  background:url(http://www.huawei.com/cn/ucmf/groups/public/documents/webasset/hw_s_232057.png);
}
#menu .con1{
  float:left;
  width:200px;
  height:265px;
  margin-top:10px;
}
#menu .con1 li{
  background:url(http://www.huawei.com/cn/ucmf/groups/public/documents/webasset/hw_u_163972.gif) left center no-repeat;
  text-indent:20px;
  height:30px;
  line-height:40px;
  margin:0px;
}
#menu a{
  color:#333333;

}
#menu .con2{
  width:370px;
  padding:0px 10px;
  float:left;
  margin-top:10px;
  text-align:center;
  border-left:1px solid #dcdcdc;
}
#menu .con2 img{
  width:259px;
  height:140px;
}
#menu .con2 p{
  font-size:13px;
  text-align:left;
  margin:0px;
  line-height:25px;
}
.menu{
  height:277px;
}

</style>
<script language="javascript">
$(function(){
  var objs=$("#nav a");
  for(var i=0;i<objs.length;i++)
  {
   objs[i].index=i;
  }
  $(".menu").slideUp();
  $("#nav a").mouseover(function(){
   $(".menu").slideUp();
   $(".menu:eq("+this.index+")").slideDown();
  });
  $(".menu").mouseleave(function(){
   $(this).slideUp();
  });
});
</script>
<body>
<div id="headbg">
<div id="head">
  <img src=">
  <div class="right">

  </div>
  <div class="clear"></div>
</div>
</div>
<div id="navbg">
<div id="nav">
<a href="1">行业洞察</a>
<a href="">方案和产品</a>
<a href="">技术支持</a>
<a href="">加入华为</a>
<a href="" >华为商城</a>
<div class="clear"></div>
</div>
<div id="menu">
<div class="menu">
<div class="con1">
  <ul class="taxonomy">
       <li><a href="/cn/industry/customer-voices/index.htm" class="topfrx">客户声音</a></li>
       <li><a href="/cn/industry/consumer-lab/index.htm" class="topfrx">消费者研究</a></li>
       <li><a href="/cn/industry/moving-forward/index.htm" class="topfrx">创新</a></li>
                      <li><a href="/cn/industry/huawei-voices/index.htm" class="topfrx">热点技术</a></li>
                      <li><a href="/cn/industry/standards-contributions/index.htm" class="topfrx">标准与行业贡献</a></li>
         </ul>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="clear"></div>
</div>

<div class="menu">
<div class="con1">
  <ul class="taxonomy">
       <li><a href="/cn/industry/customer-voices/index.htm" class="topfrx">客户声音2</a></li>
       <li><a href="/cn/industry/consumer-lab/index.htm" class="topfrx">消费者研究</a></li>
       <li><a href="/cn/industry/moving-forward/index.htm" class="topfrx">创新</a></li>
                      <li><a href="/cn/industry/huawei-voices/index.htm" class="topfrx">热点技术</a></li>
                      <li><a href="/cn/industry/standards-contributions/index.htm" class="topfrx">标准与行业贡献</a></li>
         </ul>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="clear"></div>
</div>
<div class="menu">
<div class="con1">
  <ul class="taxonomy">
       <li><a href="/cn/industry/customer-voices/index.htm" class="topfrx">客户声音3</a></li>
       <li><a href="/cn/industry/consumer-lab/index.htm" class="topfrx">消费者研究</a></li>
       <li><a href="/cn/industry/moving-forward/index.htm" class="topfrx">创新</a></li>
                      <li><a href="/cn/industry/huawei-voices/index.htm" class="topfrx">热点技术</a></li>
                      <li><a href="/cn/industry/standards-contributions/index.htm" class="topfrx">标准与行业贡献</a></li>
         </ul>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="clear"></div>
</div>
<div class="menu">
<div class="con1">
  <ul class="taxonomy">
       <li><a href="/cn/industry/customer-voices/index.htm" class="topfrx">客户声音4</a></li>
       <li><a href="/cn/industry/consumer-lab/index.htm" class="topfrx">消费者研究</a></li>
       <li><a href="/cn/industry/moving-forward/index.htm" class="topfrx">创新</a></li>
                      <li><a href="/cn/industry/huawei-voices/index.htm" class="topfrx">热点技术</a></li>
                      <li><a href="/cn/industry/standards-contributions/index.htm" class="topfrx">标准与行业贡献</a></li>
         </ul>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="clear"></div>
</div>
<div class="menu">
<div class="con1">
  <ul class="taxonomy">
       <li><a href="/cn/industry/customer-voices/index.htm" class="topfrx">客户声音5</a></li>
       <li><a href="/cn/industry/consumer-lab/index.htm" class="topfrx">消费者研究</a></li>
       <li><a href="/cn/industry/moving-forward/index.htm" class="topfrx">创新</a></li>
                      <li><a href="/cn/industry/huawei-voices/index.htm" class="topfrx">热点技术</a></li>
                      <li><a href="/cn/industry/standards-contributions/index.htm" class="topfrx">标准与行业贡献</a></li>
         </ul>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="con2">
  <img src="xx"/>
  <p class="bold">宇内极速，200G的狂欢</p>
  <p>在TG2012的6天时间里，超过6500名全球电脑爱好者，疯狂地在高达200Gbps这一史无前例的极速世界里“争抢着”流量，上演了一场极速狂欢。</p>
</div>
<div class="clear"></div>
</div>
</div>

</body>
</html>

ibogood

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
帅气的菜单

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml"> .clear{ clear:both; } * li{ list-style:none; } * a{ text-decoration:none; } #he
复制链接

扫一扫