css怎么样清除浮动


本文摘自PHP中文网,作者coldplay.xixi,侵删。

css清除浮动的方法是使用clear属性清除浮动,clear属性定义了元素的哪边上不允许出现浮动元素,代码为【img{float:left;clear:both;}】。

本教程操作环境:windows7系统、css3版,DELL G3电脑。

css清除浮动的方法:

css可以使用clear属性清除浮动。clear属性介绍如下:

clear属性定义了元素的哪边上不允许出现浮动元素。在 CSS1 和 CSS2 中,这是通过自动为清除元素(即设置了 clear 属性的元素)增加上外边距实现的。

在 CSS2.1 中,会在元素上外边距之上增加清除空间,而外边距本身并不改变。不论哪一种改变,最终结果都一样,如果声明为左边或右边清除,会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下。

属性值:

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

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

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

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

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

使用clear属性清除浮动示例:

图像的左侧和右侧均不允许出现浮动元素:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<html>

<head>

<style type="text/css">

img

  {

  float:left;

  clear:both;

  }

</style>

</head>

<body>

<img src="/i/eg_smile.gif" />

<img src="/i/eg_smile.gif" />

</body>

</html>

效果图:

dcf3fbbd113bc64a890def39918c2de.png

相关教程推荐:CSS视频教程

以上就是css怎么样清除浮动的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

一招搞定css相对原点定位背景图片

如何解决css float错位问题

css box-lines属性怎么用

如何优化css expression性能

css实现图片右边有字

css如何实现文字外发光效果

怎么在html页面写css样式表

css怎么设置悬浮效果

css怎么选择父元素

css怎么增加阴影

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...