【HTML/CSS】display相关属性

1 display的定义

display规定元素应该生成的框的类型

display使用不谨慎，可能会违反HTML中定义的显示层次结构

2 display的取值

常用的取值：

none：不显示
block：显示为块级元素，元素前后会带有换行符
inline：默认，元素会被显示为内联元素
inline-block：行内块元素
list-litem：作为列表显示
flex：弹性盒子布局
grid：网格布局

不常用的取值

run-in：会根据上下文作为块级元素或内联元素显示
table：块级表格
inline-table：内联表格
table-row-group：元素作为一行或多行的分组，类似tbody
table-header-group 此元素会作为一个或多个行的分组来显示，类似thead。
table-footer-group 此元素会作为一个或多个行的分组来显示，类似tfooter。
table-row：此元素会作为一个表格行显示（类似tr）。
table-column 此元素会作为一个单元格列显示（类似col）
table-cell 此元素会作为一个表格单元格显示（类似 td 和th）
table-caption 此元素会作为一个表格标题显示（类似 caption）
inherit：规定应该从父元素继承 display 属性的值。

【HTML/CSS】display相关属性相关推荐

CSS 动画相关属性动态实例大全（82种），2023年祝福第二弹（送你一只守护兔）(下），守护兔源代码免费下载
2023年春节祝福第二弹--送你一只守护兔(下) CSS 动画相关属性动态实例大全(82种).守护兔源代码免费下载本文目录: 五.CSS3 动画相关属性实例大全 (1).CSS3的动画基本属性 (2 ...
html+css:display:flex属性
博客 </a></li><li class="" title="高价值源码课程分享"><a data-report-c ...
css文字自动换行及css文字相关属性
white-space: normal; normal:忽略多余的空白,元素内如果有多个空格在一起或换行符(回车键),浏览器会把其看作一个空格来处理,不会影响自动换行(就是元素内容过长,在一行上显示不 ...
CSS display:table属性用法解析
本节和大家重点讨论一下CSS display:table的使用,当IE8发布时,它将支持很多新的CSS display属性值,包括与表格相关的属性值,CSS表格能够解决所有那些我们在使用绝对定位和浮动 ...
html block属性,css display block属性的意思、作用和效果
css中display的block属性是什么意思呢?他是指拥有该属性的html元素以块的方式显示,同时,该元素的前面和后面都会换行,也就是说,如果给一个元素B设置的display:block,那么该元 ...
三分钟快速了解CSS Display的属性：Block,Inline,Inline-Block
文章目录三分钟快速了解CSS Display的属性:Block,Inline,Inline-Block Block Inline Inline-block Block,Inline,Inline-B ...
css动画相关属性详解
css动画相关属性详解文章目录 css动画相关属性详解什么是CSS动画? 一.@keyframes规则二.延迟动画-animation-delay 三.设置动画应运行多少次animation-i ...
CSS display的属性
可能的值值描述 none 此元素不会被显示. block 此元素将显示为块级元素,此元素前后会带有换行符. inline 默认.此元素会被显示为内联元素,元素前后没有换行符. inline-blo ...
CSS display overflow 属性 cursor光标类型
display属性功能:规则网页元素如何显示的问题. 取值:none(隐藏).block(以块元素显示).inline(以行内元素显示) block:可以实现将行内元素转成块元素. ...

【HTML/CSS】display相关属性

1 display的定义

2 display的取值

【HTML/CSS】display相关属性相关推荐

最新文章

热门文章