您的位置：首页 > 其它

万能兼容所有浏览器导航条-学习笔记

2016-05-14 23:32 316 查看

兼容所有浏览器的万能浏览器，很多漂亮的导航基本都是由此导航条演化而来，多多练习几遍。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>nav</title>
<style>
body,div,ul,li{margin: 0;padding:0;}
ul{
list-style:none;
height:45px;
line-height: 45px; /*垂直居中，子元素均会继承该样式*/
background:#00f;
}
ul li{float:left;}
ul li a{
color:#fff;
display: block;  /*块元素设置高度才有效*/
height: 45px;
float:left;  /*兼容IE6*/
text-decoration: none;
padding: 0 20px;
}
ul li a:hover{background: #ccc;}
</style>
</head>

<body>
<ul>
<li><a href="#">menu1</a></li>
<li><a href="#">menu2</a></li>
<li><a href="#">menu3</a></li>
<li><a href="#">menu4</a><
4000
span class="hljs-tag"></li>
<li><a href="#">menu5</a></li>
</ul>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 导航

相关文章推荐

新的分享

章节导航