div本来就是块级元素,.clearfix::after为何还要再转为块级元素?

来源:2-4 清除浮动

Livesinkon

2020-10-20 20:27:50

# 具体遇到的问题
div本来就是块级元素,所以我理解都是.clearfix::after不需要再转为块级元素了,这里为何还要转呢?

# 报错信息的截图

# 相关课程内容截图
http://img.mukewang.com/climg/5f8ed7b109ea4ed804690539.jpg# 尝试过的解决思路和结果

# 粘贴全部相关代码,切记添加代码注释(请勿截图)

在这里输入代码,可通过选择【代码语言】突出显示

写回答

3回答

好帮手慕码

2020-10-23

“weixin_慕沐1378591”同学你好,你的理解没有问题,但是本提问中,content是空的,所以这里就不考虑换行的因素哦。

祝学习愉快~

0

weixin_慕沐1378591

2020-10-23

感觉老师这里有点略过了::after伪元素里的content内容,这里实现的是在div块级元素的文字最后添加一个空,如果改成content:"123";的话就是下面这个效果,这个添加出来的123是行内元素,而行内元素会并列显示

http://img.mukewang.com/climg/5f92a6ff091971a905550201.jpg


所以需要转为块级元素,这样显示的时候会自动换行

http://img.mukewang.com/climg/5f92a75c096e4bec02650282.jpg


去掉内容中的123改为content:'';  display: block; 后就变成这样了

http://img.mukewang.com/climg/5f92a7ee09ce0d9802660249.jpg

之前我也是困惑了很久,所以这个只是个人理解

2
heixin_慕沐1378591
h 还有这个是关键clear:both clear表示清除浮动对自己的影响,both表示左右浮动都清除 清除浮动后转为块级元素
h020-10-23
共1条回复

好帮手慕码

2020-10-21

同学你好,首先,这里是给clearfix元素的伪元素after添加样式哦:

(即clearfix元素 和clearfix元素的伪元素不是同一个元素)

http://img.mukewang.com/climg/5f8f95ad09f0f6f002820140.jpg

其次,after 伪元素默认为行内元素,所以这里是有必要给它设置为块级元素的。

祝学习愉快~

2
heixin_慕沐1378591
h 快来看看我上面的回答有没有问题...
h020-10-23
共1条回复

0 学习 · 15276 问题

查看课程