淘先锋技术网

首页 1 2 3 4 5 6 7

伪类是CSS中非常重要的概念,它可以为元素添加一些特殊的样式,通过模拟元素的状态或位置来实现。下面是一些常用的CSS伪类样式。

/* :hover,鼠标悬停状态 */
a:hover {
color: red;
text-decoration: underline;
}
/* :active,鼠标点击状态 */
a:active {
color: green;
}
/* :visited,访问过的链接样式 */
a:visited {
color: purple;
}
/* :focus,得到焦点状态,如input */
input:focus {
border-color: blue;
}
/* :first-child,选中第一个子元素 */
ul li:first-child {
font-weight: bold;
}
/* :last-child,选中最后一个子元素 */
ul li:last-child {
font-style: italic;
}
/* :nth-child(n),选中第n个子元素 */
ul li:nth-child(2) {
text-transform: uppercase;
}

通过使用伪类样式,可以为元素添加更多的个性化样式,使页面更加美观和符合用户期望。