css - 子元素选择器设置下边框,为什么所以的子元素都出现下边框了

查看:138
本文介绍了css - 子元素选择器设置下边框,为什么所以的子元素都出现下边框了的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>tab选项卡</title>
    <style>
        *{
            padding:0;
            margin:0;
            list-style:none;
            font-size:12px;
        }
        body{
            background-color:#eee;
        }
        #tabs{
            width:300px;
            margin:50px auto;
            background-color:#fff;
        }
        #title li{
            float:left;
            width:60px;
            text-align:center;
            line-height:30px;
        }
        #title ul>li{
            border-bottom:1px solid red;
        }
    </style>
</head>
<body>
    <div id="tabs">
        <div id="title">
            <ul>
                <li>公告</li>
                <li>规则</li>
                <li>论坛</li>
                <li>安全</li>
                <li>公益</li>
            </ul>
        </div>
        <div id="content">
            <ul>
                <li>阿里苏宁发布"新三体"战略 打造未来十年格局</li>
                <li>高诚信会员无条件信任 200余万广告商品被处罚</li>
            </ul>
            
        </div>
    </div>
</body>
</html>

解决方案

#title ul>li 就是指#title下的ul下的子元素li

这篇关于css - 子元素选择器设置下边框,为什么所以的子元素都出现下边框了的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆