CSS选择器

作者: RachelCT | 来源:发表于2019-01-13 15:54 被阅读3次

上篇介绍了css的引入方式,这篇总结一下css选择器。
css选择器的语法格式如下:

selector{           (选择器)
Property:value1;(键值对)
Property:value2;
}
CSS选择器分类
标记选择器给全部元素标签指定样式,如给<p>和<div>标签指定样式,在css中的应用如下:
p{color: red;font-size: 25px}
div{background-color: gray;font-size: 30px}

类选择器'.'指定HTML文档中某一声明了class的元素标签的样式,即类选择器的使用方法是在HTML中的标签元素声明class,如下:

<div class="c_style"></div>

然后在css文档中的使用如下:

.c_style{background-color: gray;font-size: 30px}

id选择器'#'的使用与类选择器类似,只是此时该指定id,而不是class。同样在HTM中应用:

<div id="id_style"></div>

然后在css文档中的使用如下:

#id_style{background-color: gray;font-size: 30px}

组合选择器则是几种选择器组合起来产生效果,如在HTML中:

<div id="id_style"  class="c_style"></div>

然后在css文档中的使用如下:

#id_style.c_style{background-color: gray;font-size: 30px}

相关文章

  • CSS选择器

    CSS 元素选择器CSS 选择器分组CSS 类选择器详解CSS ID 选择器详解CSS 属性选择器详解CSS 后代...

  • CSS选择器

    目录: CSS派生选择器 CSS元素选择器 CSS Id 和 Class选择器 CSS 属性选择器 CSS 派生选...

  • css选择器

    css选择器】 1.css属性选择器 2.css伪类选择器 3.css层次选择器

  • CSS 选择器

    CSS 选择器 CSS 基本选择器及其扩展 CSS 基本选择器 通配符选择器 * 元素选择器 使用标签的名称...

  • Sublime 学习web的css

    html + css + js css引用 css外部样式 css优先级 css的选择器 标签选择器 类选择器 i...

  • CSS选择器

    CSS选择器的作用 CSS 选择器用于定位我们想要给予样式的 HTML 元素。 CSS选择器的类型 CSS选择器大...

  • JQuery CSS选择器

    CSS普通选择器 选择器函数 CSS伪类选择器

  • CSS-选择器1-概述

    CSS选择器-系列文章 CSS选择器-系列文章下一节 CSS选择器2-类选择器CSS3参考手册

  • CSS选择器、优先级以及!important知识总结

    一、CSS选择器 关于CSS选择器,首先请看这里:CSS 选择器参考手册 通过以上,我们可以将CSS选择器分为以下...

  • CSS

    CSS规则 at 规则 CSS选择器 CSS选择器 继承与层叠 继承与层叠 CSS 属性 CSS 属性 CSS值 ...

网友评论

    本文标题:CSS选择器

    本文链接:https://www.haomeiwen.com/subject/ugxldqtx.html