CSS中的伪类是什么,有什么用??
发布网友
发布时间：2022-04-28 13:06
共5个回答
懂视网
时间：2022-04-28 17:27
CSS3添加了比以前CSS2中更多的伪类。（推荐课程：css3视频教程）
伪类被添加到选择器上，它前面有一个冒号，后跟一个带括号值的属性。伪类的语法如下
selector: pseudo-class { property:value;}基本伪类
有许多不同的伪类，下面的代码示例演示了一些最基本的伪类。这些被归类为动态伪类，由于用户的操作而改变。在代码示例中，：link 伪类用于将链接的颜色设置为蓝色。一旦用户访问了链接，则：visited 伪类用于将链接的颜色更改为maroon。还演示了：当用户将鼠标悬停在图像上时，悬停用于将带有白色文本的紫色圆圈更改为带有黄色文本的粉红色正方形。的：重点伪类更改日期输入字段为灰色，当用户点击或在其上“重点”。代码示例在这里 为自己尝试一下！
<!DOCTYPE html>
<html>
<head>
<style>
a:link{
color:blue;
}
a:visited{
color:maroon;
}
div {
background-color: purple;
color: white;
line-height:90px;
font-size:20px;
text-align:center;
width:200px;
height:200px;
-moz-border-radius: 100px;
-webkit-border-radius: 100px;
border-radius: 100px;
}
div:hover {
background-color:pink;
color:yellow;
width:200px;
height:200px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
}
input:focus {
background-color: lightgray;
}
</style>
</head>
<body>
<p><b><a href="https://www.php.cn/" target="_blank">Click on this link!</a></b></p>
<div>Hover over this</div>
<p><b>Enter todays date in the field below</b></p>
<form>
Date: <input type="text" name="Date"><br>
</form>
</body>
</html>一些更多的伪类
下面列出了一些更常用的伪类。可在此处找到所有伪类的完整列表。
：first-child- 此类允许您将特定样式添加到作为其父元素的第一个子元素的元素。
：root- 此伪类用于匹配文档的根元素。
：lang- 不同的语言有不同的规则和惯例。有时您需要创建多种语言使用的页面。：lang伪类对于这种情况很有用。它主要查看lang =“”HTML属性和<meta>元素，并相应地匹配元素。
：disabled- 这允许您指示禁用的输入元素，如文本字段和按钮。
：fullscreen- 此伪类使用处于全屏模式的元素。
伪元素
伪元素具有与伪类类似的功能，因为它们可以由CSS设置样式并由用户代理添加。但是它们与伪类不同，因为它们允许您使用DOM中不存在的元素。伪元素的语法标识符通常是双冒号，而不是像伪类一样的单冒号。常见的伪元素是:: before ，:: after 和:: first-line 。重要的是要注意一些编码器使用单个冒号：对于伪元素，这是CSS2中的惯例。请记住这一点，以避免伪类和伪元素之间的混淆。
最后
伪类可以使得特殊状态应用于元素。它们允许开发人员创建很酷的效果，而无需使用JavaScript等脚本语言。有许多不同类型的伪类，使您可以在保持代码简单的同时使页面更具交互性和趣味性。
热心网友
时间：2022-04-28 14:35
CSS伪类(Pseudoclasses)是选择符的螺栓，用来指定一个或者与其相关的选择符的状态。它们的形式是selector:pseudoclass{property:value;}，简单地用一个半角英文冒号(:)来隔开选择符和伪类。
CSS很多的建议并没有得到浏览器的支持，但有四个可以安全使用的用在连接上的CSS伪类。
◆link用在为访问的连接上。
◆visited用在已经访问过的连接上。
◆hover用于鼠标光标置于其上的连接。
◆active用于获得焦点(比如，被点击)的连接上。
例如：
a:link{color:red }a:visited{color:green}
a:hover{color:blue}
a:active{color:orange}
热心网友
时间：2022-04-28 15:53
热心网友
时间：2022-04-28 17:28
例如 p:first-line（段落第一行文本） P;first-letter(段落中第一个字母）等等
它的存在我觉得是方便用CSS样式来控制人们需求吧 如果没有他们的存在 我们也会为了达到同样的效果使用一些没这么方便的办法 他给带来了方便
虽然不是最快回答 希望能对你有所帮助 希望采纳
热心网友
时间：2022-04-28 19:19
