CSS 浮动的16条规则——如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄
来源:互联网 发布:kdl50w700a安装软件 编辑:程序博客网 时间:2024/05/16 14:42
原文链接:http://blog.csdn.net/luguo0816/article/details/7265677
1.浮动元素会从文档正常流中删除,但它仍会影响布局
2.浮动非替换元素必须为其指定width,否则元素的width会趋于0而导致浮动元素不能完整显示3.一旦元素具有了浮动属性,它便成为了一个块级元素。
4.浮动元素的左右外边界不能超出包含块的左右内边界
5.浮动元素永不会重叠
6.浮动元素不会超过容器的上padding
7.后浮动的元素永不会超过先浮动元素的顶端
8.浮动元素会尽可能高地放置,便这个高受限于规则6和规则7
9.浮动元素的下边界没有要求,因此当容器不足以容下浮动元素时,浮动元素会向下延伸。但部分浏览器会采取增大容器高度以容下浮动元素
,而对于符合CSS2.1规范的浏览器要想让容器容下浮动元素的一个可行方法是:让容器也浮动
10.浮动元素向下延伸时,不会影响正常文本的显示,文本会相对于浮动元素进行偏移。但部分文本背景会被浮动元素遮住
11.如果浮动元素设置了负的外边距、这将破坏规则4、6、7
12.当浮动元素的width>容器的width时,这会使得浮动元素超出容器的左右边界(超左超右依浮动方向而定)
13.浮动重叠规则:行内框(如strong)与浮动元素重叠时,其边框、背景、内容均位于浮动元素之上;块框与浮动元素重叠时,其边框、背景在
浮动元素之下,而内容在浮动元素之上。
14.对某个元素应用clear:left,意味着这个元素的左边不能有浮动元素。
15.clear不能用于非块级元素,比如<br/>,在大多数浏览器看来它是一个非块级元素,因此如果对br应用clear来清除浮动不会有任何效果,
除非改变br的display:block。
16.如果某元素应用clear清除浮动,则此元素设置的上外边距值会被忽略,但会有一个重新计算的上外边距值(甚至可能为0).如果希望此元素
与浮动元素之间有一个明确的间隔,可以在浮动元素上设置下外边距。
*******************************************************************************************************************************************************************************
替换元素:
替换元素是浏览器根据其标签的元素与属性来判断显示具体的内容。
比如:<input /> type="text" 的是,这是一个文本输入框,换一个其他的时候,浏览器显示就不一样
(X)HTML中的<img>、<input>、<textarea>、<select>、<object>都是替换元素,这些元素都没有实际的内容。
非替换元素:
(X)HTML 的大多数元素是不可替换元素,他们将内容直接告诉浏览器,将其显示出来。
比如<p>wanmei.com</p>
浏览器将把这段内容直接显示出来。
除了这两字,还有两种非常属性的元素,显示元素,他分为两种情况,一种是‘块及元素’ ‘block’,还有一种是“行内元素”inline,大家也叫“内联元素”。
- CSS 浮动的16条规则——如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄
- CSS 浮动的16条规则——如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄
- CSS 浮动的16条规则
- 浮动元素后的非浮动元素问题
- 非浮动元素的margin对浮动元素无效
- 浮动元素父元素设置css清除浮动的方法
- 【CSS】思考和再学习——关于CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响
- css 中 float:left ,right 浮动与非浮动内联元素与块元素之间的显示关系
- Html+CSS浮动的广告条
- CSS:浮动元素(float)的认识
- CSS中元素浮动的清除
- css 清除元素的浮动方法总结
- CSS 浮动元素的水平居中
- IE6 对浮动元素内的未指定宽度的块级元素错误的解释 BUG
- CSS ——浮动与定位元素
- CSS——浮动的清除
- 为什么要用浮动&浮动元素如何显示&浮动元素对其他元素的影响&清浮动
- 如果制作网页中浮动广告条的关闭按钮
- java多线程
- 使用Xcode和Instruments调试解决iOS内存泄露
- Win8开机总是“配置Windows更新失败,正在还原更改”的解决方法(图)
- Ecache用法1
- 线程同步的方法:sychronized、lock、reentrantLock等总结分析
- CSS 浮动的16条规则——如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄
- android 数据库更新操作步骤
- javaIO流
- 随笔日记之字符串如何显示不同颜色
- Number Sequence
- Java多线程学习(吐血超详细总结)
- 方法的重载和重写
- CSS hack方式一览
- Android SDK Manager国内无法更新的解决方案(亲测有效)