css二：选择器介绍

最新推荐文章于 2020-12-02 11:59:22 发布

faine℃

最新推荐文章于 2020-12-02 11:59:22 发布

阅读量244

点赞数

分类专栏： css

本文链接：https://blog.csdn.net/qq_41828282/article/details/96895321

版权

CSS如何工作？

DOM：文档对象模型

css语法

css声明块

在这里插入图片描述

css语句

**@-规则（At-rules）**在CSS中被用来传递元数据，条件信息或其他描述信息。是由（@）符号开始，紧跟着一个表明它是那种规则的描述符，之后是这种规则的语法块，最终由一个半角分号（;）结束；
最终语法示例：

@import ‘custom.css’; /*该规则向当前css导入其他css文件/
嵌套语句是@-规则中的一种，只有在特定条件匹配时才会应用到文档上。、

@media 只有在运行浏览器的设备匹配其表达条件时才会应用
@supports只有浏览器确实支持被测功能时才会应用
@ducument 只有当前页面匹配一些条件时才会应用

@media (min-width: 801px){
   
	body{
   
		margin: 0 auto;
		width: 800px;
	}
}

选择器

简单选择器

简单选择器就是使用html标签来当作选择器；

类选择器

类选择器是由一个点“.”以及后面的类名组成，如下示例：

<ul>
  <li class="first done">Create an HTML document</li>
  <li class="second done">Create a CSS style sheet</li>
  <li class="third">Link them all together</li>
</ul>

/* The element with the class "first" is bolded */
.first {
   
  font-weight: bold;
}

/* All the elements with the class "done" are strike through */
.done {
   
  text-decoration: line-through;
}