display有哪些比较常用的值呢?
在通常的项目开发中比较容易被使用的值主要有:
none(元素不会被显示);
block(元素将显示为块级元素,元素前后会带有换行符);
inline(元素会被显示为内联元素,元素前后没有换行符);
inline-block(行内块元素。CSS2.1 新增的值);
table(元素会作为块级表格来显示,类似 <table>,表格前后带有换行符);
table-row(元素会作为一个表格行显示,类似 <tr>);
table-cell(元素会作为一个表格单元格显示,类似 <td> 和 <th>)。
有所区别的display="none"和visibility="hidden"?
一眼看去,他们都是元素隐藏的意思;没错,它们确实是元素隐藏哦!但是,它们还是有所区别的啦!
visibility="hidden"表示(仅)隐藏,不可恢复。当visibility被设置为"hidden"的时候,元素虽然被隐藏了,仍然占据它原来所在的位置。visibility会保留元素的位置。元素被隐藏之后,就不能再接收到其它事件了,也不能再接收响应到事件了,因此也就无法通过JS令其显示出来。
display="none"隐藏(元素消失),可恢复。当display被设置为"none"的时候,除了元素隐藏之外,与visibility="hidden"完全相反。
display与visibility的属性值的设置,还有回流与重绘上的区别哦!想了解回流与重绘详情请点击:《页面回流与页面重绘》
jQuery 与 zepto 中dispaly:none的区别?
dispaly:none在jQuery 与 zepto 中的区别!想必大部分初学者还是不了解的吧!想了解jQuery 与 zepto 中dispaly:none的区别,嘿嘿,那就点击:《jQuery 与 zepto 中dispaly:none的区别》
display实现的水平垂直居中!
利用position和margin进行元素水平垂直居中;想必大家还是比较熟悉,经常用的。但不知道你是否使用过display:table与table-cell对元素进行水平垂直居中呢?如果你还没有体验过,那就点击:《CSS实现水平垂直居中对齐》,其中的第五、六种方法,将为你解答!