程宇寒 2019-10-15 21:37 采纳率: 100%
浏览 354
已采纳

css中的伪元素(伪元素本质上是创建了一个虚拟容器(元素))

伪元素本质上是创建了一个虚拟容器(元素)?

这句话怎么理解!
如下代码中,我的理解对吗?

图片说明
图片说明
图片说明

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>伪类和伪元素</title>
<style type="text/css">
/* 伪元素  */
p::first-letter {
  color: red;
}

/* 伪元素  */
h3::first-letter {
  color: blue;
}

/* 伪元素  */
/*
div::first-letter {
  color: red;
}
*/

/*类选择器*/
.first-letter {
  color: red;
}

</style>
</head>
<body>
<h1 style="color: blue;">伪类和伪元素</h1>
<p>江西省赣州市于都县</p>
<p>老家在江西省赣州市于都县</p>

<h3>天若有情天亦老</h3>
<h3>人间正道是沧桑</h3>

<div>一万年太久只争朝夕</div>
<div>江山如此多娇,引无数英雄竞折腰</div>
<a href="https://www.jianshu.com/p/996d021bced3">
参考网页https://www.jianshu.com/p/996d021bced3
</a>
<br/>
有些文章上说,伪元素本质上是创建了一个虚拟容器(元素),是下面这句代码的意思吗?
<!-- 以下类似于div::first-letter {color: red;}的效果 -->
<div><span class="first-letter">我</span>爱中国</div>
</body>
</html>
  • 写回答

1条回答 默认 最新

  • threenewbee 2019-10-16 12:34
    关注

    我的理解:
    css的引用,目的是为了将网页内容和语义(html)和它的表现形式(style)相分离,而如果我们要表示,文档开头第一个字如何如何,而文档结构本身又没有区分第一个字和后面的字。
    这就出现了矛盾,到底是去修改文档,满足样式的定义,还是直接在样式里面就能处理,不要设计文档,按理说是后者,但是没有伪元素只能用前者。
    于是伪元素就出现了,解决的就是这个问题。
    而伪类,就是进一步,把一批伪元素再统一定义。

    具体看
    https://www.jianshu.com/p/996d021bced3

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 已采纳回答 3月21日

悬赏问题

  • ¥15 C++ yoloV5改写遇到的问题
  • ¥20 win11修改中文用户名路径
  • ¥15 win2012磁盘空间不足,c盘正常,d盘无法写入
  • ¥15 用土力学知识进行土坡稳定性分析与挡土墙设计
  • ¥70 PlayWright在Java上连接CDP关联本地Chrome启动失败,貌似是Windows端口转发问题
  • ¥15 帮我写一个c++工程
  • ¥30 Eclipse官网打不开,官网首页进不去,显示无法访问此页面,求解决方法
  • ¥15 关于smbclient 库的使用
  • ¥15 微信小程序协议怎么写
  • ¥15 c语言怎么用printf(“\b \b”)与getch()实现黑框里写入与删除?