css选择器标签选择器和id选择器

来源:互联网 发布:淘宝兼职有没有真的 编辑:程序博客网 时间:2024/05/08 19:36

一,标签选择器

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>08-css标签选择器.html</title>    <!--        标签选择器,根据指定的标签名称,找到当前界面所有的该名称的标签,然后设置属性        1,格式:        2,注意点:        (1),标签选择器选中的是当前界面所有的标签,而不是选择的某个标签        (2),不管藏得多深,都会被选中    -->    <style>        p{            color: red;        }    </style></head><body><p>我是标签选择器</p><p>我是标签选择器</p><p>我是标签选择器</p><p>我是标签选择器</p><ul>    <li>你好</li>    <li>你好</li>    <li>你好</li></ul></body></html>

二,id选择器

<!--        id选择器,根据指定id找到对应的标签,然后设置属性        1,格式:        #id的属性值{            属性名称:属性值;        }        2,注意点:        (1),id命名,不能以数字开头        (2),id命名格式包括字母、数字、下划线        (3),不能是标签的名称        (4),在编写id选择器时,一定要在id前面加上#        (5),在同一界面中id命名不能重复        (6),仅仅是为了设置样式,一般不会用id,因为id是留给js开发用的    -->    <style>        #id1{            color: red;        }        #id2{            color: lightcoral;        }        #id3{            color: greenyellow;        }        #id4{            color: purple;        }    </style>
<h1>成功法则</h1><p id="id1">迟到毁一生</p><p id="id2">早退穷三代</p><p id="id3">按时上下班</p><p id="id4">终成高富帅</p>
0 0
原创粉丝点击