css 中复合选择器的作用加html代码练习

复合选择器的使用

交集选择器的使用

交集选择器主要是使标签既满足第一个选择器又满足第二个选择器;在数学中将两个区域的交集部分进行css的样式设置如图所示css 中复合选择器的作用加html代码练习_第1张图片

两个标签直接相连
例子如下`css 中复合选择器的作用加html代码练习_第2张图片
图片结果如下
css 中复合选择器的作用加html代码练习_第3张图片

并集选择器

并集选择器的作用是将不同的基础选择器并到一起使用,常用来统一样式的风格在每个选择器当中用逗号隔开 其格式为
标签一,标签二{属性和属性值}
其原理如下:css 中复合选择器的作用加html代码练习_第4张图片
例子如下:

css 中复合选择器的作用加html代码练习_第5张图片
代码结果:
css 中复合选择器的作用加html代码练习_第6张图片

后代选择器

后代选择器就是找到一个表签下的所有的一个标签进行样式设置 常用在列表之中
其格式为标签一 标签二{}
其原理如下css 中复合选择器的作用加html代码练习_第7张图片
例子如下:
代码图css 中复合选择器的作用加html代码练习_第8张图片
结果如下:css 中复合选择器的作用加html代码练习_第9张图片

子代选择器

子代选择器类似于后代选择器的作用 子代选择器只作用于标签的直属子标签
其格式为 标签一>标签二{}
代码图如下css 中复合选择器的作用加html代码练习_第10张图片
其结果如下:在这里插入图片描述

伪类选择器

伪类也是用来修饰样式的 超链接标签a的伪类 link visited active hover的类型分别代表
链接的最开始的状态 链接被访问后的状态 鼠标点击时的状态 和鼠标悬停时的状态


 
  
  伪类选择器
  
 
 
  伪类选择器
 

其结果 的颜色

你可能感兴趣的:(css 中复合选择器的作用加html代码练习)