css float与p |html css id对应

css特效实例，css中用中括号，css 侧边栏导航，css油橄榄精华对比，css图标增加角标数字，css代码中标签居中显示，html css id对应 css float与p |html css id对应

.float-left{
float: left;
}
.float-right{
float: right;
}

通过定义浮动方向为left或right，可以让元素向左或向右浮动。但是，如果没有清除浮动，会出现一些问题。

.clearfix{
/*清除浮动*/
zoom: 1; 
&:before, &:after{
content: "";
display: table;
}
&:after{
clear: both;
}
}

在使用float的过程中，如果浮动的元素和其他元素发生了重合，可以考虑给其他元素添加margin或padding，让它们不会发生重合。

另外，在使用float的过程中遇到过p标签和float的兼容性问题。在一些浏览器中，p标签中的文字会环绕在浮动的元素周围，导致布局错乱。解决方案就是给p标签添加clear属性。

.clear-p{
clear: both;
}

通过给p标签添加clear属性，可以让p标签独占一行，不会受到浮动元素的影响。这样就能够保证页面的布局不会出现意外的情况。