css伪类选择器怎么用
css伪类选择器是一种选择特定状态或行为元素的特殊选择器,使用element:pseudo-class语法,常见伪类包括:hover(悬停)、active(激活)、focus(焦点)、link(链接)和visited(访问过)。可用于为元素悬停、激活、获得焦点、链接和访问时应用样式,例如为按钮悬停时添加阴影,按下时添加背景色,以及为输入框获得焦点时添加边框。
CSS伪类选择器详解
什么是CSS伪类选择器?
CSS伪类选择器是一种选择匹配特定状态或行为的元素的特殊类型选择器。
如何使用CSS伪类选择器?
立即学习“前端免费学习笔记(深入)”;
一般使用以下语法:
element:pseudo-class { style properties;}
其中:
常见的CSS伪类选择器
示例
使用:hover伪类为按钮悬停时添加阴影:
button:hover { box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);}
使用:active伪类为按下时为按钮添加背景色:
button:active { background-color: #007bff;}
使用:focus伪类为输入框获得焦点时添加边框:
input:focus { border: 1px solid #000;}