一、:hover
当鼠标悬停在标题上时,可以使用:hover伪类选择器对
标签进行修饰。比如改变标题文字颜色、加粗显示等,可以增强页面交互性。
代码示例:
h1:hover { color: red; font-weight: bold; }
二、:active
当标题被激活(鼠标点击)时,可以使用:active伪类选择器对
标签进行修饰。比如改变标题文字颜色、字体样式等,可以提高页面观感。
代码示例:
h1:active { color: blue; font-family: Arial; }
三、:first-child
选择第一个
标签可以使用:first-child伪类选择器对
标签进行修饰。比如改变第一个标题的文字颜色、字体大小等,可以提高页面排版效果。
代码示例:
h1:first-child { color: green; font-size: 24px; }
四、:last-child
选择最后一个
标签可以使用:last-child伪类选择器对
标签进行修饰。比如改变最后一个标题的文字背景色、字体粗细等,可以提高页面美观度。
代码示例:
h1:last-child { background-color: yellow; font-weight: bold; }
五、:nth-child(n)
选择第n个
标签可以使用:nth-child(n)伪类选择器对
标签进行修饰。比如改变第3个标题的文字颜色、字体大小等,可以实现页面样式的层次感。
代码示例:
h1:nth-child(3) { color: orange; font-size: 16px; }
六、:visited
选择已访问过的
标签可以使用:visited伪类选择器对
标签进行修饰。比如改变已访问标题的文字颜色、字体样式等,可以提高用户体验度。
代码示例:
h1:visited { color: purple; font-style: italic; }