2025年css盒子模型小实例:新浪导航案例

css盒子模型小实例:新浪导航案例

大家好,我是讯享网,很高兴认识大家。
<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>新浪导航栏</title>

    <style>

        .nav {

            /* background-color: aquamarine; */

            height: 41px;

            line-height: 41px;

            border-top: 3px solid #ff8500;

            border-bottom: 1px solid #edeef0;

            background-color: #fcfcfc;

        }



        .nav a {

            display: inline-block;

            height: 41px;

            font-size: 12px;

            color: #4c4c4c;

            text-decoration: none;

            padding-left: 20px;

            padding-right: 20px;



        }



        a:hover {

            background-color: #eee;

            color: #ff8500;

        }

    </style>

</head>



<body>

    <div class="nav">

        <a href="#">设为首页</a>

        <a href="#">手机新浪网</a>

        <a href="#">移动客户端</a>

        <a href="#">博客</a>

        <a href="#">微博</a>

        <a href="#">关注我</a>

    </div>



</body>



</html>

讯享网


讯享网

小讯
上一篇 2025-01-27 07:45
下一篇 2025-03-26 17:56

相关推荐

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