【Web学习笔记DAY05】CSS（2）

【前端学习笔记-DAY05】CSS选择器

CSS基础选择器

标签选择器

标签选择器是指用HTML标签名称作为选择器，按标签名称分类，为页面中某一类标签指定统一的CSS样式。

  a {
     padding: 0px;
     margin: 0px;
   }
此例中已经选中页面中所有的a标签

这种选择器的最大优点是可以快速选中页面中的某一类标签的统一样式。同时，缺点也是不能差异化样式。

类选择器

主要作用可以选择一个或者多个标签。依据标签中的class=“类名”来选择设置样式。

.box {
    width: 200px;
    height: 200px;
}

注意：

• 类选择器使用英文的点号" . "进行标识，后面写类名就好。
• 类名不建议使用下划线" _ "来命名选择器。
• 不要用纯数字、中文等命名，尽量使用英文字母来表示。

具体更详细的一些代码规范问题，推荐W3C的规范手册可以看看：https://m.w3cschool.cn/webdevelopment/drshcozt.html

id选择器

id名就是HTML标签中id的属性值。大多数HTML标签都可以定义id属性。元素的id是唯一的，只能应用于具体的某一个元素。

#txt {
    color: green;
}
id选择器使用英文" # "进行标识，后面写id名就好。

id选择器与类选择器的区别
类选择器是可以重复使用的，可多次使用。
id选择器是唯一的，不可重复。类似身份证一样。

通配符选择器

通配符选择器用“*”号表示， * 就是 所有的 他是所有选择器中作用范围最广的，能匹配页面中所有的元素。

* {
  margin: 0;                    /* 定义外边距*/
  padding: 0;                   /* 定义内边距*/
}

代码约定

• 尽量少用通用选择器 *
• 尽量不使用 ID 选择器
• 不使用无具体语义定义的标签选择器 div span 。

CSS复合选择器

复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的,目的是为了可以选择更准确更精细的目标元素标签。

后代选择器

后代选择器又称为包含选择器，用来选择元素或元素组的后代。它能选择任何包含在内 的标签。

子元素选择器

子元素选择器只能选择作为某元素子元素的元素。其写法就是把父级标签写在前面，子级标签写在后面，中间跟一个 > 进行连接，注意，符号左右两侧各保留一个空格。

交集选择器

交集选择器由两个选择器构成，找到的标签必须满足：既有标签一的特点，也有标签二的特点。

比如这张图选择的是类名为class的h3标题。

并集选择器

并集选择器是各个选择器通过逗号连接而成的，任何形式的选择器（包括标签选择器、class类选择器id选择器等），都可以作为并集选择器的一部分。

相邻选择器

相邻选择器就是 选择器1+选择器2, 目的是为了精准选择选择器1后边的选择器2。

先更到这里把。。。。