admin管理员组

文章数量:1538393

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

<!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></li>
        <li><a href="#">menu5</a></li>
    </ul>
</body>
</html>

本文标签： 学习笔记导航条浏览器

版权声明：本文标题：万能兼容所有浏览器导航条-学习笔记 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://m.elefans.com/dongtai/1726975424a1092731.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。