本文详细探讨了行内元素的盒模型特性，包括它们无法设置宽度和高度，但可以设置水平方向的padding和border，以及如何影响页面布局。同时，介绍了display属性的重要作用，用于切换元素的显示方式，如block、inline、inline-block等，并提到了visibility属性，用于控制元素的可见状态。这些概念对于理解和调整网页布局至关重要。
行内元素盒模型特点
- 内联元素不能设置宽度和高度
- 内联元素可以设置padding ，但是垂直方向的padding不会影响页面的布局
- 内联元素可以设置border，但是垂直方向的border不会影响页面的布局
- 内联元素支持水平方向的外边距，不支持垂直方向
display属性
display - 改变元素的盒子类型。
可选值：
- block - 块元素
- inline - 行内元素
- inline-block - 行内块元素
- none - 元素不在页面中显示
- table 元素会作为一个表格显示
- flex 元素会作为一个弹性容器显示
- inline-flex 元素会作为行内弹性容器显示
visibility属性
visibility - 设置元素显示状态
可选值：
- visible - 默认值， 元素显示
- hidden - 元素隐藏，但是元素占据本身位置空间
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
