HTML选择器有哪些？如何正确使用它们？

```css

a[href^="https://www.baidu.com"]{

/*样式代码*/

```

伪类和伪元素选择器

伪类选择器用于定义元素的特殊状态，如`:hover`、`:focus`等。伪元素选择器则用于选择元素的一部分内容，如`::before`、`::after`。

```css

a:hover{

/*鼠标悬停时的样式*/

p::first-line{

/*段落的第一行样式*/

```

复合选择器和组合选择器

复合选择器通过组合上述选择器来选择更具体的元素。而组合选择器则用于选择具有特定关系的元素，如后代选择器（空格）、子选择器（`>`）等。

```css

divp{

/*选择所有div元素内的段落*/

p>span{

/*选择所有p元素的直接子元素span*/

```

高级选择器

随着CSS3的发展，选择器家族也得到了扩展。一些高级选择器，如结构性伪类、否定伪类等，为我们提供了更多强大的选择方式。

结构性伪类选择器

结构性伪类选择器能够根据元素在文档树中的位置选择元素，如`:first-child`、`:last-child`、`:nth-child()`等。

```css

li:first-child{

/*选择第一个li元素*/

li:last-child{

/*选择最后一个li元素*/

p:nth-child(2){

/*选择所有p元素中的第二个子元素*/

```

否定伪类选择器

否定伪类选择器（`:not()`）用于排除符合特定条件的元素。

```css

p:not(.special){

/*选择所有不包含special类的p元素*/

```

结语

HTML选择器是CSS世界中不可或缺的一部分，它们帮助我们精确控制和设计网页。从基础的类选择器、ID选择器到高级的结构性伪类和否定伪类选择器，每一种选择器都有其独特的用途和场景。深入理解和掌握这些选择器将极大提升你的Web开发能力，并为构建高质量的网站打下坚实的基础。无论是前端新手还是资深开发者，灵活运用选择器都能使你的网页开发工作更加高效、富有成效。