CSS标准(4)-控制框

简介: CSS标准(4)-控制框

块级元素

块级元素:块级(block-level)元素在页面上表现为一个块,单独占有一行。

块级框:块级元素生成来包含其子框和生成的内容的框称为块级框(Block-level box)。

块容器框:块容器框(block container box)只包含其他块级框,或者创建一个行内格式化上下文(inline formatting context)从而只包含行内框。

块框:是块容器框的块级框称为块框(block boxes)。

三者关系如下图所示:

行级元素

行级元素:行级元素是在源文档中那些不为其内容不形成新的块;而让其内容分布在多行中的元素。

行级框:行级元素生成行级框,而这些框会参与某个行格式化上下文。

行内框:内容参与了包含它的行格式化上下文的行级框。

原子行级框:那些不是行内框的行级框(例如可替换的行级元素、行内块元素、行内表格元素)被称为原子行级框。

两种行级框的关系如下图所示:

(完)

本文作者 : cyningsun

本文地址https://www.cyningsun.com/04-22-2014/css-standard-four.html

版权声明 :本博客所有文章除特别声明外,均采用 CC BY-NC-ND 3.0 CN 许可协议。转载请注明出处!

目录
相关文章
|
10月前
|
前端开发 JavaScript 开发者
优化CSS重置过程:探索CSS层叠技术的应用与优势
这篇文章介绍了一种名为CSS层叠的技术,用于优化CSS重置过程。它解释了CSS重置的概念,即通过删除浏览器默认样式来确保在不同浏览器上呈现一致的外观。然后,它引入了CSS层叠技术,以更好地控制样式的层次结构和优先级。
|
前端开发
css定位锚点透明
css定位锚点透明
CSS-动态计算高度
Viewport viewport:可视窗口,也就是浏览器。 vw Viewport宽度, 1vw 等于viewport宽度的1% vh Viewport高度, 1vh 等于viewport高的的1%
|
前端开发
CSS流动布局-页面自适应
CSS流动布局-页面自适应
154 0
|
前端开发
CSS层级小技巧:在滚动时自动添加头部阴影
CSS层级小技巧:在滚动时自动添加头部阴影
270 0
CSS层级小技巧:在滚动时自动添加头部阴影
|
Web App开发 前端开发
通过外部CSS或嵌入式样式缩放时,Firefox会使图像模糊
通过外部CSS或嵌入式样式缩放时,Firefox会使图像模糊
112 0
|
前端开发
CSS设置高度撑满页面
CSS设置高度撑满页面
146 0
|
前端开发
7、CSS定位(绝对、相对、固定)
7、CSS定位(绝对、相对、固定)
184 0
7、CSS定位(绝对、相对、固定)
|
前端开发 JavaScript
css控制超出宽度 ...展示
css控制超出宽度 ...展示
218 0
|
前端开发 开发者 容器
【CSS】Grid 栅格布局 | 更新中..命名网格项
【CSS】Grid 栅格布局 | 更新中..命名网格项
305 0
【CSS】Grid 栅格布局 | 更新中..命名网格项