ul标签 

<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>Document</title>
    <style>
        #footer {
            border: 3px solid #dd0000;
            padding-top: 30px;
            padding-bottom: 25px;
        }

        #footer p {
            border-bottom: 1px solid red;
            padding-bottom: 12px;
        }


        .c {
            float: left;
            color: #fff;

            background: rgba(0, 0, 0, 0.8) !important;
            margin: 20px;
        }

        .c1 {
            width: 450px;
        }

        .c a {
            color: #fff;
        }

        #footer ul.tes li {
            float: left;
            width: 165px;
            margin-top: 15px;
        }
        #footer ul.tes li a{
            font-size: 15px;
        }
    </style>
</head>

<body>
    <div id="footer">
        <div class="c c1">
            <p><a href="#">Products list</a></p>第一个
            <ul class="tes">
                <li><a href="#">Building Wire</a></li>
                <li style="width: 240px;"><a href="#">Building Wire</a></li>
                <li><a href="#">Building Wire</a></li>
                <li><a href="#">Building Wire</a></li>
                <li><a href="#">Building Wire</a></li>
                <li><a href="#">Building Wire</a></li>
                <li><a href="#">Building Wire</a></li>
                <li><a href="#">Building Wire</a></li>
            </ul>
        </div>
        <div class="c">第二个</div>
        <div class="c">第三个</div>
        <div style="clear: both;"></div>
    </div>
</body>

</html>

　　

posted @ 2022-04-13 16:40  指针园  阅读(58)  评论(0)    收藏  举报