斜角导航

  

   
• 首页HOME

   
• 文化中心CULTURAL

   
• 作品展示WORKS SHOW

   
• 服务报价SERVICE

   
• 团购活动BUYINH

   
• 场景介绍INTRODUCTION

   
• 客片分享CUSTOMER

   
• 新娘达人MASTER

   
• 联系我们CONTACT

  

 

body{margin:0;padding:0;font-size:12px;font-family:Arial,"宋体";backgorund:#fff;}/*文档清零,字体,字号,背景设置.*/
div,ul,li,p,form,h1,h2,h3,h4,h5,input,dl,dt,dd,fieldset,table,tr,td{margin:0;padding:0;}/*边界元素清零*/
ul,li,ol{list-style:none;}/*去除列表符号*/
img{border:none;}/*去除图片按钮边框*/
a{text-decoration:none;}/*去除超链接下划线*/
img,input,textarea{vertical-align:middle;}
.clear{ clear:both;}
table{margin:0 auto}
td{border:#000 solid 1px;}

#nav {
 width:100%;
 height:54px;
 clear:both;
 border-top:solid 1px #cac9c9;
 border-bottom:solid 1px #cac9c9
}
#nav ul {
 width:1008px;
 height:54px;
 margin:0 auto;
   
}
#nav li {
 font-size:16px;
 font-weight:bold;
 text-align:center;
 width:100px;
 height:54px;
 float:left;
 margin:0 6px;
 position:relative;
 _display:inline;
}
#nav li a {
 color:#616161;
 text-decoration:none;
 display:block;
 height:36px;
 padding:9px 0
}
#nav li strong {
 line-height:18px;
 display:block;
}
#nav li em {
 font-size:14px;
 line-height:18px;
 display:block;
}
#nav .cur a,#nav a:hover {
 color:#fff;
 background:#c00202
}
#nav a:hover:after,#nav a:hover:before,#nav .cur a:after,#nav .cur a:before {
 position:absolute;
 content:"";
 border-style:solid;
 border-width:0 0 54px 28px;
}
#nav a:hover:after,#nav .cur a:after {
 border-color:transparent transparent transparent #ccc;
 top:0;
 right:-28px;
}
#nav a:hover:before,#nav .cur a:before {
 border-color:transparent transparent #ffd800 transparent;
 top:0;
 left:-28px;
}

 

转载于:https://www.cnblogs.com/xiaoleidiv/p/3247482.html