display:block,inline,inline-block,none的区别
Posted xxcnhj
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了display:block,inline,inline-block,none的区别相关的知识,希望对你有一定的参考价值。
display几个常用的属性以及区别
none,block,inline,inline-block;
none:会隐藏元素,不占据dom空间,下文会提到;
block:块级元素,前后会有换行符,占据一行;可以进行宽高设置,上下左右的padding,margin属性也可以设置;
inline:行内元素,前后没有换行符,不能进行宽高设置;由左到右,从上到下排列,不可以设置上下margin,padding属性;
inline-block:既有宽高属性,又不会换行;
display:none跟visibility:hidden的区别
display:none,让元素隐藏而且不占据dom空间,其他元素可以占据这个空间;
visibility:hidden,也是让元素隐藏但是会占据dom空间,其他元素不能占据这个空间;
以上是关于display:block,inline,inline-block,none的区别的主要内容,如果未能解决你的问题,请参考以下文章
display:block;inline;inline-block大总结
display:block | inline | inline-block的区别
将 slideToggle() 行为更改为 display:inline-block 而不是 display:block?