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 许可协议。转载请注明出处!

目录
相关文章
|
9月前
|
前端开发 开发者 容器
【专栏:CSS基础篇】CSS定位与布局:从静态到浮动、定位
【4月更文挑战第30天】本文介绍了CSS定位与布局的基础,包括静态、相对、绝对、固定定位以及浮动。静态定位遵循HTML顺序,相对定位可在正常位置基础上偏移,不占用额外空间。绝对定位基于最近已定位祖先元素定位,脱离文档流。固定定位相对于浏览器窗口定位,无视页面滚动。浮动用于文字环绕图片等,可能导致父元素高度塌陷。Flexbox布局提供更灵活的元素排列和对齐方式,适配各种复杂布局需求。理解并掌握这些布局技术能提升网页设计的灵活性和响应性。
144 0
|
前端开发
css定位锚点透明
css定位锚点透明
|
前端开发 容器
如何使用 CSS 来控制 img 标签在父元素中自适应宽度或高度,并按比例显示
如何使用 CSS 来控制 img 标签在父元素中自适应宽度或高度,并按比例显示
852 1
|
前端开发
CSS标准流与盒子模型
CSS标准流与盒子模型
|
前端开发
CSS流动布局-页面自适应
CSS流动布局-页面自适应
148 0
|
Web App开发 前端开发
通过外部CSS或嵌入式样式缩放时,Firefox会使图像模糊
通过外部CSS或嵌入式样式缩放时,Firefox会使图像模糊
110 0
|
前端开发
CSS基础-塌陷及定位
clear:right; 右侧不允许有浮动元素
134 0
|
前端开发
7、CSS定位(绝对、相对、固定)
7、CSS定位(绝对、相对、固定)
184 0
7、CSS定位(绝对、相对、固定)
|
前端开发 JavaScript
css控制超出宽度 ...展示
css控制超出宽度 ...展示
213 0
|
前端开发 定位技术 索引
【前端第四课】CSS值和单位;CSS文字排版;CSS变换,过渡,动画;CSS定位
【前端第四课】CSS值和单位;CSS文字排版;CSS变换,过渡,动画;CSS定位
【前端第四课】CSS值和单位;CSS文字排版;CSS变换,过渡,动画;CSS定位

热门文章

最新文章