html选择符分几类,css的选择符有哪些？

要使用css对HTML页面中的元素实现一对一，一对多或者多对一的控制，这就需要用到CSS选择符。HTML页面中的元素就是通过CSS选择符进行控制的。那么css的选择符有哪些？

CSS的选择符(选择器)有哪些？

1、id选择器(例 # myid)：匹配 ID 等于“myid”的任意元素 。

2、类选择器(例.myclassname)：匹配 class 等于“myclassname”的任意元素.

3、标签选择器(例div, h1, p)：选择指定元素名称的所有元素。

4、相邻选择器(E + F)：用于选择(不是内部)指定的第一个元素之后紧跟的元素。

5、子选择器(E > F)：用于选取带有特定父元素的元素，例ul > li，选择所有父级是

• 元素的每个
• 元素。

  6、后代选择器(E F)：用于选取元素内部的元素。

  7、通配符选择器( * )：匹配任意元素。

  8、属性选择器：选择带有特定属性的元素。[attribute]：用于选取带有指定属性的元素。

  [attribute=value]：用于选取带有指定属性和值的元素。

  [attribute~=value]：用于选取属性值中包含指定词汇的元素。

  [attribute|=value]：用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。

  [attribute^=value]：匹配属性值以指定值开头的每个元素。

  [attribute$=value]：匹配属性值以指定值结尾的每个元素。

  [attribute*=value]：匹配属性值中包含指定值的每个元素。

  9、伪类选择器：用于向某些选择器添加特殊的效果。:active:any-link:blank:checked:current:default

  :defined:dir():disabled:drop:empty:enabled

  :first:first-child:first-of-type:fullscreen:future:focus

  :focus-visible:focus-within:has():host:host():host-context()

  :hover:indeterminate:in-range:invalid:is():lang():last-child

  :last-of-type:left:link:local-link:not():nth-child()

  :nth-col():nth-last-child():nth-last-col():nth-last-of-type():nth-of-type():only-child

  :only-of-type:optional:out-of-range:past:placeholder-shown:read-only

  :read-write:required:right:root:scope:target

  :target-within:user-invalid:valid:visited:where()

  伪类连同伪元素一起，他们允许你不仅仅是根据文档 DOM 树中的内容对元素应用样式，而且还允许你根据诸如像导航历史这样的外部因素来应用样式(例如 :visited)。

  同样的，可以根据内容的状态(例如在一些表单元素上的 :checked)，或者鼠标的位置(例如 :hover 让你知道是否鼠标在一个元素上悬浮)来应用样式。