老师在源代码中的公共样式的问题
来源：3-2 站点导航HTML结构
迷失的小麦
2020-01-31 13:17:57
/*常用公共样式*/
.fl {
float: left;
display: inline;
}
.fr {
float: right;
display: inline;
}
.cf:before,
.cf:after {
content: " ";
display: table;
}
.cf:after {
clear: both;
}
.cf {
*zoom: 1;
}老师的源代码中,
为什么.cf要设置display: table;?
为什么.fr和.fl要设置display: inline;?
为什么.cf要同时设置:before和:after？
写回答
1回答
-
同学你好，问题解答如下：
1.这个是清除浮动的一种方式，因为伪类是行内元素，需要设置成块元素才会有效果。在入门阶段也讲解过，把它设置成display: block.当然了，代码是非常灵活的，设置成table或者inline-block都可以的哦。
另外，:before和:after可以同时设置，也可以设置:after。清除浮动的写法不唯一，按照自己的习惯写就行。清除浮动的语法固定记住就行，按照课程中讲过的去写也行。
https://class.imooc.com/lesson/756#mid=18862
2..fr和.fl是用来设置浮动的，页面中会有很多元素浮动，给浮动元素加一个fr或者fl类名即可添加浮动效果，比较简单。display: inline;这里没有用，可以去掉。
如果我的回答帮助到了你，欢迎采纳，祝学习愉快~
0
相似问题