演练网站的头部导航栏的制作 1014 HTML

最新推荐文章于 2022-11-03 22:41:47 发布

鲸鱼编程pyhui

最新推荐文章于 2022-11-03 22:41:47 发布

阅读量488

点赞数

本文链接：https://blog.csdn.net/ifubing/article/details/109086373

版权

演练网站的头部导航栏的制作 1014 HTML

视频

演练菜单按钮的制作 HTML5 2216 - 西瓜视频
https://www.ixigua.com/6883480625635033613/

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        * {
            padding: 0;
            margin: 0;
        }

        a {
            text-decoration: none;
        }

        .clearfix:after {
            content: "";
            display: block;
            clear: both;
        }

        li {
            list-style: none;
        }

        header {
            width: 760px;
            margin: auto;
        }

        .cr {
            background-color: red;
        }

        .cb {
            background-color: blue;
        }

        .banner {
            height: 150px;
            background: url("images/banner.jpg") no-repeat;
        }

        .menu ul {
            background: url("images/bg1.jpg");
        }

        .menu ul li {
            float: left;
            /*width: 60px;*/
            /*margin-right: 2px;*/
            text-align: center;
            height: 32px;
            line-height: 32px;
            border-right: 1px solid #fff;
            padding: 0 18px;
        }


    </style>
</head>
<body>

<header class="">
    <div class="banner">banner</div>
    <div class="menu cb">
        <ul class="clearfix">
            <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>
</header>

</body>
</html>

鲸鱼编程pyhui

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
1
评论
演练网站的头部导航栏的制作 1014 HTML

演练网站的头部导航栏的制作 1014 HTML视频演练菜单按钮的制作 HTML5 2216 - 西瓜视频https://www.ixigua.com/6883480625635033613/代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style>
复制链接

扫一扫