CSS 选择器

来源：互联网发布：刺客袖剑淘宝编辑：程序博客网时间：2024/06/08 12:30

Html 由N个标签(节点、元素、标记)组成。
html的css选择器有如下几种:

标签选择器:直接在html中的head中通过style标签定义我们在html标签中的样式.

.....<head>    .....    <style>        p{            //在这里定义P标签的样式        }    </style></head><body>    <p>.....</p></body>

类选择器:在标签中通过class=”xxxx”,来指定标签的样式.

****注:css文件如果定义在外面,此时就需要在html的head标签中通过link标签来引入我们的css文件**-----------------------------------------------------**......//index.html<div class="content"></div>//index.css.content{    //定义div标签的样式}.....

id选择器:通过给标签定义id,从而来给标签设置样式;和类选择器一样,只不过就是需要将div的标签中的class换成id=”content”,然后在css文件中不是通过.content设置,而是通古偶#content来设置样式.
群组选择器: 当一个html中,有两个或者以上的标签在设置样式的时候度一样,此时我们就可以不去写两份一样的代码,通过群组选择器就可以达到这样我们想要的效果.

......<head>    p,h1,h2{    //定义公共的属性,例如    color:red;    }</head><body>    <p>这是字段</p>    <h1>这是1号标题</h1>    <h2>这是2号标题</h2></body>......

后代选择器:也称作为派生选择器,通过依据元素在其位置的上下文关系来定义.这样我们就能够更精准的去控制我们标签的样式.

index.html.....<body>    <div class="top">        <p>xxxx</p>    </div></body>.....index.css.top p{    // 定义样式 TODO}

阅读全文

0 0