display的常⽤属性display的属性值
display所有的取值在下图中：
常⽤的⼏种取值
margin属性怎么用1. display:none
此元素不会被显⽰，并且不占据页⾯空间
与visibility:hidden的区别
hidden占实际空间，其后的元素仍在该有的位置，⽽none后的元素占none原有的位置
2. display:block
块级元素，会独占⼀⾏
块级元素的特点
(1) 每个块级元素都从新的⼀⾏开始，并且其后的元素也另起⼀⾏;
(2) 如果不设置宽度，其宽度会⾃动填满⽗元素的宽度；
(3) 元素的⾼度、宽度、⾏⾼以及margin上下左右都可设置；
3. display:inline
多个⾏内元素占同⼀⾏，直到放不下才换⾏
⾏内元素的特点
(1) 元素会在⼀⾏内显⽰，超出屏幕宽度⾃动换⾏；
(2) 元素的⾼度、宽度、⾏⾼都不可设置，只能设置margin和padding左右的值；
(3) 元素的宽度就是它包含的⽂字或图⽚的宽度，只能是靠元素内的内容撑开；
4. display:inline-block
⾏内块元素，与⾏内元素⼀样可以在⼀⾏内显⽰
⾏内块元素的特点
(1)和其他元素都在⼀⾏上；
(2) 元素的⾼度、宽度、⾏⾼以及顶和底边距都可设置；
5. display:flex
⾏内元素与块级元素的区别
1. 嵌套
⾏内元素：⾏内元素只能嵌套⾏内元素，不能嵌套块级元素。(⽰例元素：span,b,i,a,u,sub,sup,strong,em)块级元素：块级元素可以嵌套⾏内元素，但是⾏内元素不可以嵌套块级元素。(⽰例元素：div,h1-h6,ul,ol,dl,p)
2. margin和padding
⾏内元素：有margin和padding，但是只能够设置左右的值，设置上下的值是⽆效的。
块级元素：可以设置margin和padding上下左右的四个值，margin可以有负值，padding不允许有负值。
3. 设置宽⾼
⾏内元素：不允许设置宽⾼，⾏内元素的宽⾼只能是由⾏内元素内的内容撑起来。
块级元素：允许设置宽⾼，如果不设置，默认宽度是⽗元素的100%，⾼度是由内容撑起来的。
总结
以前⽤display时挺懵逼的，所以就专门写了这篇，相关的⽤法如果忘记了就翻⼀翻这篇⽂章吧！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。