CSS 用浮动制作一个导航栏

最新推荐文章于 2024-09-26 19:17:56 发布

xuehyunyu

最新推荐文章于 2024-09-26 19:17:56 发布

阅读量7.7k

点赞数

文章标签： CSS 浮动 float 导航栏 html

本文链接：https://blog.csdn.net/xuehyunyu/article/details/72773945

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        ul{
            list-style: none;
        }
        li{
            float: left;/*浮动:文本悬浮。脱离了文档流，悬浮在文档上方*/
            width: 150px;
            color: red;
            font-size: 30px;
            text-align: center;/*文本居中*/
        }
    </style>

       <title>导航</title>
</head>
<body>

<ul>
    <li>购物车</li>
    <li>帮助中心</li>
    <li>加入收藏</li>
    <li>设为首页</li>
    <li>登录</li>
    <li>注册</li>
</ul>

</body>
</html>

运行结果：