display:none; 元素不会被显示 不占据位置
display: block; 快级元素 可设置高宽 没有设置则宽度占据一行 高度则由内容撑开
display: inline; 行内元素 行内元素是由内容撑开的 高宽无效
display:inline-block; 行内快级元素 行内快级元素可以由内容撑开 也可设置高宽
块级元素
div,p,h1~h5, ul, li…
行内元素
span, a, sub, sup, strong…
行内块级元素
button, img…
display:none 和 visibility:hidden 区别
display:none 不占任何位置
visibility:hidden 元素隐藏 但占位置
css3 flex 弹性布局
给父级设置display:flex属性后
子元素的float ,clear, vertical-align属性会失效
常用属性
justify-content : center 子元素水平居中
justify-conter : space-around
justify-conter : space-between
align-items : center 子元素垂直居中
(要设置高度 否则无效)