消除浮动问题
浮动溢出:容器不设高度且子元素浮动时,容器高度不能被内容撑开。 此时,内容会溢出到容器外面而影响布局。
1、给父级div定义height属性
2、包含浮动元素的父级标签添加overflow:hidden或者overflow:auto
3、使用 ::after 伪元素。ul::after{display:block;content:””;clear:both}
伪元素::和伪类:的区别
伪元素:在内容元素的前后插入额外的元素或样式,但是这些元素实际上并不在文档中生成。它们只在外部显示可见,但不会在文档的源代码中找到它们,因此,称为“伪”元素。
伪类:将特殊的效果添加到特定选择器上。它是已有元素上添加类别的,不会产生新的元素。例如:a:hover {color: #FF00FF}p:first-child {color: red}
总结: 伪类是通过在元素选择器上加⼊伪类改变元素状态,⽽伪元素通过对元素的操作进⾏对元素的改变。