请教老师,使用after和before有什么区别?

来源:4-1 页面底部开发(1)

慕UI4313976

2021-03-20 23:12:37

如题。

写回答

1回答

好帮手慕久久

2021-03-21

同学你好,解答如下:

after和before的区别就是二者的位置不同。before的含义是“在谁谁之前”,after的含义是“在谁谁之后”:以before为例,位置如下:

http://img.mukewang.com/climg/6056adab09801b4905800356.jpg

http://img.mukewang.com/climg/6056adcd090f263b07330274.jpg

同理,after位置如下:

http://img.mukewang.com/climg/6056ae35096433a200000000.jpg

所以同学可以按照二者的位置差别,来选用相应的元素。比如下图:

http://img.mukewang.com/climg/6056ae9e09485e4517740659.jpg

图标是处于内容前面的,所以这里选用了before。但是由于图标使用的是定位,所以换成after也可以。因此如果after和before都能实现效果,那么选用哪个都可以。但是有一点需要注意,清除浮动时,我们需要在父元素底部(父元素最后)添加一个元素,所以需要使用after:

http://img.mukewang.com/climg/6056af6b0953215206510763.jpg

祝学习愉快!


0

0 学习 · 15276 问题

查看课程