加入收藏 | 设为首页 | 会员中心 | 我要投稿 汽车网 (https://www.0577qiche.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 编程要点 > 语言 > 正文

CSS中的clear怎样使用,有哪些属性值

发布时间:2023-09-27 09:52:26 所属栏目:语言 来源:
导读:这篇文章主要介绍“CSS中的clear如何使用,有哪些属性值”的相关知识,下面会通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“CSS中的clear如何使用,有哪些属性值”文
这篇文章主要介绍“CSS中的clear如何使用,有哪些属性值”的相关知识,下面会通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“CSS中的clear如何使用,有哪些属性值”文章能帮助大家解决问题。

clear在CSS中的用法是什么

目标css文档中clear的主要作用是直接用来清除元素的一些浮动元素的效果。

clear属性指定段落的左侧或右侧不允许浮动的元素。

在 CSS1 和 CSS2 中,这是通过自动为清除元素增加上外边距实现的。在 CSS2.1 中,它会在相邻的元素上外边距之上额外地增加从而可以清除内部的空间,而外边距本身并不因此而改变。

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

clear属性值:

eft 在左侧不允许浮动元素。

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

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

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

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

示例如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>123</title> 
<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 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. This is also some text.</p>
</body>
</html>

 

(编辑:汽车网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章