在CSS中,display属性用于定义元素的渲染方式,它有多种可选取的值,不同的值会产生不同的显示效果。一、display: block.block { display: block; } 该属性值将
在CSS中,
display属性用于定义元素的渲染方式,它有多种可选取的值,不同的值会产生不同的显示效果。
一、
display: block
.block { display: block; }
该属性值将元素转换为块级元素显示,即元素会在独立的行上显示,同时宽度会自动填满父容器。如下图所示:
Block
二、
display: inline
.inline { display: inline; }
该属性将元素转换为内联元素显示,即元素会在同一行内显示,同时宽高与元素内容一致,无法设置宽高,margin/padding只对左右有效,如下图所示:
Inline三、
display: inline-block
.inline-block { display: inline-block; }
该属性将元素转换为内联块元素显示,即元素会在同一行内显示,同时可以通过设置宽高来控制尺寸,margin/padding对全部方向都有效,如下图所示:
四、
display: none
.none { display: none; }
该属性值将元素隐藏,即整个元素会被移除,不会占据页面空间,同时也无法通过HTML文档中的JavaScript访问,如下图所示:
以上就是常用的几种display属性值的介绍,它们可以根据实际需求来选择,让元素呈现出理想的布局和样式。
粉丝
0
关注
0
收藏
0