浏览器开发工具如何模拟:hover、:focus和:active状态？

浏览器开发工具中可以通过进入元素的'Styles”（样式）选项卡并单击元素样式名称旁边的'＋”符号来添加伪类选择器。通过这个功能来模拟:hover、:focus和:active状态即可。

例如，想要模拟:hover状态，可以在元素样式名称旁边单击'＋”符号，然后输入':hover”，之后就可以为该状态下的元素样式进行样式设置了。示例代码如下：

button:hover {
   background-color: yellow;
   color: black;
}

类似地，也可以使用':focus”和':active”伪类选择器来模拟元素在这些活动或状态下的样式。