- 7
- 0
- 约4.15千字
- 约 5页
- 2017-08-08 发布于河南
- 举报
CSS文档流与块级元素和内联元素
CSS文档流与块级元素(block)、内联元素(inline),之前翻阅不少书籍,看过不少文章, 看到所多的是零碎的CSS布局基本知识,比较表面.看过OReilly的CSS权威指南,发现里面提到的文档流概念让我很敏感. 可恶的是书中并没有解释文档流是什么东西,或许作者觉得这个太简单了以至于不值一提.但我觉得,这个概念实在太重要了.理解了它,一堆CSS布局的理论都 变得易于理解,并且体会到CSS这套设计的合理性所在. 于是我根据猜测,再加实验,得出一下说法.如有错误,纯属正常.
文档流
将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流.
每个非浮动块级元素都独占一行, 浮动元素则按规定浮在行的一端. 若当前行容不下, 则另起新行再浮动.
内联元素也不会独占一行. 几乎所有元素(包括块级,内联和列表元素)均可生成子行, 用于摆放子元素.
有三种情况将使得元素脱离文档流而存在,分别是浮动,绝对定位, 固定定位. 但是在IE中浮动元素也存在于文档流中(还让我觉得这样很合理gt;).
浮动元素不占任何正常文档流空间,而浮动元素的定位还是基于正常的文档流,然后从文档流中抽出并尽可能远的移动至左侧或者右侧。文字内容会围绕在浮动元素周围。当一个元素从正常文档流中抽出后,仍然在文档流中的其他元素将忽略该元素并填补他原先的空间。
浮动概念让
您可能关注的文档
- ai ei ui教学设计1.doc
- AI illustrator CS4 全部快捷键.doc
- AIO网页设计系统教程(二).doc
- AIO网页设计系统教程(三).doc
- ai半透明球制作 实用.doc
- AI焦糖涟漪小教程.doc
- AI教程_手把手教你画出美丽花朵.doc
- AI结合AE制作螺旋形图案的动画.doc
- ai滤镜.doc
- AI水壶小教程.doc
- 2026年智慧健康管理系统创新报告.docx
- 河北衡水市武强中学2025-2026学年高二下学期4月期中物理试题(含解析).docx
- 2026年人工智能行业智能老年防走失定位器创新报告.docx
- 2026年低空经济飞行器量子技术应用创新报告.docx
- 2026年农业智能农业智能育种创新报告.docx
- 河北省保定市莲池区保定市第一中学2025-2026学年高二下学期期中考试生物试题(含解析).docx
- 2026年智慧城市电子站牌充电创新报告.docx
- 河北省邯郸市平恩中学等校2025-2026学年八年级期中考试英语试题(含解析).docx
- 2026年供应链创新技术应用报告.docx
- 2026年体育智能赛事管理系统支付系统创新报告.docx
最近下载
- 2025年安徽省中考物理试卷真题(含答案及解析).docx
- 汽大众高尔夫A6维修手册.pdf VIP
- 2024-2025人教版小学1一年级数学上册(全册)教案【新教材】.doc
- 2025年高一数学必修二期中考试卷及答案.doc VIP
- 一年级数学5以内加减法计算练习题(每日一练,共42份).docx VIP
- 标准图集-西南15G701-1 -混凝土结构轻质填充墙构造图集 第一分册 加气混凝土填充墙.pdf VIP
- 一年级数学20以内加减法计算专项练习题(每日一练,共40份).docx VIP
- 一年级数学20以内加减法计算专项练习题(每日一练,共36份).docx VIP
- 参考学习资料 报验资料包 坝加固工程 表120.doc VIP
- 人教版四年级数学下册期中测试卷(含答案)精品3套.docx VIP
原创力文档

文档评论(0)