css clear属性怎么用-css教程-PHP中文网

css clear属性怎么用

青灯夜游

发布： 2019-05-28 16:38:02

原创

3464人浏览过

css clear属性指定元素的左侧或右侧上不允许出现浮动元素。可用于实现浮动的清除，解决浮动布局带来的一些问题。

css clear属性怎么用

css clear属性怎么用？

clear 属性规定元素的哪一侧不允许其他浮动元素。

语法：

立即学习“前端免费学习笔记（深入）”；

clear:left|right|both|none|inherit;

登录后复制

属性值：

●　left：在左侧不允许浮动元素。

●　right：在右侧不允许浮动元素。

●　both：在左右两侧均不允许浮动元素。

●　none：默认值。允许浮动元素出现在两侧。

Dompdf

dompdf是一个HTML到PDF转换器。在其核心，dompdf是一个（大部分）符合CSS 2.1标准的HTML布局和渲染引擎，使用PHP编写。它是一个以样式驱动的渲染器，它会下载并读取外部样式表，内联样式标签和单个HTML元素的样式属性。它还支持大多数表现性HTML属性。PDF渲染目前由PDFLib或由Wayne Munro编写的捆绑版本的R&OS CPDF类提供。（对R&OS类进行了一些重要的更改，但是）。为了使用dompdf与PDFLib，需要安装PDFLib PECL扩展。使用PD

查看详情

●　inherit：规定应该从父元素继承 clear 属性的值。

说明：

clear 属性定义了元素的哪边上不允许出现浮动元素。在 CSS1 和 CSS2 中，这是通过自动为清除元素（即设置了 clear 属性的元素）增加上外边距实现的。在 CSS2.1 中，会在元素上外边距之上增加清除空间，而外边距本身并不改变。

不论哪一种改变，最终结果都一样，如果声明为左边或右边清除，会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下。

注释：所有主流浏览器都支持 clear 属性。任何版本的 Internet Explorer （包括 IE8）都不支持属性值 "inherit"。

css clear属性示例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
img
{
float:left;
}
p.clear
{
clear:both;
}
</style>
</head>
<body>
<img src="logocss.gif" width="95" height="84" />
<p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
<p>This is also some text. This is also some text. This is also some text. This is also some text. This is also some text.</p>
<br>
<p>使用clear:both清除浮动：</p>
<img src="logocss.gif" width="95" height="84" />
<p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
<p class="clear">This is also some text. This is also some text. This is also some text. This is also some text. This is also some text. </p>
</body>
</html>

登录后复制

效果图：