1. 首页首页
  2. 科技前沿科技前沿

前端垂直导航栏

科技前沿 • • 阅读 41

前端垂直导航栏样例 代码 style type text css nav background color f1f1e6 nav ul margin 0 padding 0 line height style

大家好，我是讯享网，很高兴认识大家。

样例


讯享网

代码

<!DOCTYPE HTML>
<html>
<head>
<style type="text/css"> 
.nav {
background-color: #f1f1e6;
}

.nav ul {
margin: 0;
padding: 0;
line-height: 2em;
}

.nav a {
display: block; 
width: 8em; 
text-align: center;
text-decoration: none;
background-color: #dcc9c1;
}

.nav a:hover {
background-color: #E6E6FA;
}

</style>
</head>
<body>
    
<div class="nav">
    <ul>
        <li><a href="">文学类</a></li>
        <li><a href="">科学类</a></li>
        <li><a href="">历史/史学类</a></li>
        <li><a href="">亲子类</a></li>
        <li><a href="">教育类</a></li>
        <li><a href="">科幻/玄幻类</a></li>
    </ul>
</div>
        
</body>
</html>

讯享网

小讯
上一篇 2025-03-24 14:43
下一篇 2025-02-24 11:19

相关推荐

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/66774.html