---恢復內容開始---
http://www.w3school.com.cn/cssref/pr_class_display.asp
所有主流瀏覽器都支持 display 屬性,如IE,Firefox,Chrome,Safari,Opera;
如果規定了 !DOCTYPE,則 Internet Explorer 8 (以及更高版本)支持屬性值 "inline-table"、"run-in"、"table"、"table-caption"、"table-cell"、"table-column"、"table-column-group"、"table-row"、"table-row-group"、以及 "inherit"。
display 屬性規定元素應該生成的框的類型。
css語法 display:value;
js語法 Object.style.display=value;
可能的值
部分屬性詳解:
1. block
特點:1)獨占一行;
2)元素的高度,寬度,行高以及頂和底邊距均可設置;
3)不設置寬度時,寬度撐滿一行;
塊級元素有:<div> , <p> , <h1> .. <h6> , <ol> , <ul> , <dl> , <table> , <address> , <blockquote> , <form> , <article> , <header> , <footer> , <nav> , <section> , <html> , <body> 等;
不支持樣式:vertical-align;
2. inline
特點:1)和其他元素在一行;
2)內容撐開寬度,即元素的寬度就是它包含的文字或圖片的寬度,不可改變;
3)寬高不可設置;
4)代碼換行被解析成空格;
內聯元素有:<a> , <span> , <br> , <i> , <em> , <strong> , <label> , <q> , <var> , <cite> , <code> , <area> , <del> , <label> , <map> , <mark> , <output> , <pre> 等;
不支持樣式:background-position ;clear ;clip ;height | max-height | min-height ;width | max-width | min-width ;overflow ;text-align ;text-indent ;text-overflow;
3. inline-block
特點:1)不設置寬高時,內容撐開高度;
2)非獨占一行;
3)可設置寬高;
4)代碼換行被解析成空格;
標簽:<audio> ,<button>,<canvas>,<embed>,<iframe>,<img>,<input>,<keygen>,<meter>,<object>,<progress>,<select>,<textarea>,<video>
不支持樣式:clear ;
4. none
特點:隱藏元素並脫離文檔流;
標簽:<base>,<link>,<meta>,<title>,<datalist>,<dialog>,<param>,<script>,<source>,<style>
5. list-item
特點:1)不設寬度時,寬度撐滿一行;
2)獨占一行;
3)可設置寬高;
6. table
特點:1)不設置寬度時,寬度由內容撐開;
2)非獨占一行;
3)支持寬高;
4)默認具有表格特征,可設置table-layout、border-collapse、border-spacing等表格專有屬性;
7. table-cell
特點:1)不設置寬度時,寬度由內容撐開;
2)非獨占一行;
3)支持寬高;
4)垂直對齊;
5)同級等高;
---恢復內容結束---