选择器。

最新推荐文章于 2022-11-30 20:45:22 发布

天才-疯子-在哪

最新推荐文章于 2022-11-30 20:45:22 发布

阅读量134

点赞数

  1.什么是CSS，CSS是如何工作的？ 

  CSS就是控制html文件的样式dom。 

 
  Web浏览器将CSS规则应用于html文档以影响它们的显示方式。 

 
 2.CSS基本语法：选择器{属性：值} 

 
  例如：h1{color:blue} 这个就是将标题（标题标签h1内的文本）的颜色设置为蓝色。 

 
 3.CSS选择器。 

 
  A.类型选择器：直接选标签的元素。例：p{ }；h1{ } 

 
  B.类选择器：html文档中有class名的值。 
 格式： 
 .name{ } 

 
   
  C.id选择器：  
 html文档中有id名的值。 
 格式： 
 #name{ } 

 
  D.通用选择器： 
 它允许选择在一个页面中的所有元素。 
 格式：* { } 

 
  A.存在和值属性选择器：这些属性选择器尝试匹配精确的属性值： 
 格式： 
 [A]{？ } : 
 就是具有A属性的所有元素都被赋予？格式。  
   

 
  B.子串值属性选择器:  
 格式： [a|=b]选择a属性中是 b 或以 b 开头的元素。 

 
  [a^=b]选择a属性中b开头的元素 

 
  [a$=b]选择a属性中以b结尾的元素。 

 
  [a*=b]选择a属性中包含以b的元素。 

伪类（Pseudo-classes）：匹配处于确定状态的一个或多个元素，比如被鼠标指针悬停的元素，或当前被选中或未选中的复选框，或元素是DOM树中一父节点的第一个子节点。是一个以冒号(:)作为前缀的关键字

伪元素（Pseudo-elements）:匹配处于相关的确定位置的一个或多个元素，例如每个段落的第一个字，或者某个元素之前生成的内容。伪元素前缀是两个冒号 (::)
组合器（Combinators）：这里不仅仅是选择器本身，还有以有效的方式组合两个或更多的选择器用于非常特定的选择的方法。例如，你可以只选择divs的直系子节点的段落，或者直接跟在headings后面的段落。

Combinators	Select
A,B	匹配满足A（和/或）B的任意元素（参见下方同一规则集上的多个选择器）.
A B	匹配任意元素，满足条件：B是A的后代结点（B是A的子节点，或者A的子节点的子节点）
A > B	匹配任意元素，满足条件：B是A的直接子节点
A + B	匹配任意元素，满足条件：B是A的下一个兄弟节点（AB有相同的父结点，并且B紧跟在A的后面）
A ~ B	匹配任意元素，满足条件：B是A之后的兄弟节点中的任意一个（AB有相同的父节点，B在A之后，但不一定是紧挨着A）

多用选择器（Multiple selectors）：这些也不是单独的选择器；这个思路是将以逗号分隔开的多个选择器放在一个CSS规则下面，以将一组声明应用于由这些选择器选择的所有元素。

关注