css3伪类选

CSS3伪类选取

在CSS3中，我们可以使用伪类来选取页面中一些特殊的元素或状态，它们可以让我们更加方便地进行样式的定制和控制。

下面是一些常用的CSS3伪类：

/* 鼠标悬停状态，对应HTML的:hover */
a:hover {
  color: red;
}

/* 鼠标点击后的状态，对应HTML的:active */
button:active {
  background-color: green;
}

/* 第一个子元素，对应HTML的:first-child */
ul li:first-child {
  font-weight: bold;
}

/* 最后一个子元素，对应HTML的:last-child */
ul li:last-child {
  font-style: italic;
}

/* 奇数子元素，对应HTML的:nth-child(odd) */
table tr:nth-child(odd) {
  background-color: lightgray;
}

/* 偶数子元素，对应HTML的:nth-child(even) */
table tr:nth-child(even) {
  background-color: white;
}

使用这些伪类可以帮助我们轻松地进行页面样式的定制和控制，让页面变得更加美观和易于使用。