block(塊級元素)
address , blockquote , center , dir , div , dl , fieldset , form , h1 , h2 , h3 , h4 , h5 , h6 , hr , isindex , menu , noframes , noscript , ol , p , pre , table , ul , li
inline(行內(nèi)元素)
a , abbr , acronym , b , bdo , big , br , cite , code , dfn , em , font , i , img , input , kbd , label , q , s , samp , select , small , span , strike , strong , sub , sup ,textarea , tt , u , var
可變元素(根據(jù)上下文確定類型)
applet ,button ,del ,iframe , ins ,map ,object , script
塊級元素與行內(nèi)元素的區(qū)別
- 首先從視覺上來看多個行內(nèi)元素在同一行,而塊級元素獨占一行
- 其次塊級元素可設(shè)置width和height唆香,而行內(nèi)元素不可以
- 最后是關(guān)于margin和padding的設(shè)置器净,塊級元素完全支持這倆個屬性,而行內(nèi)元素表現(xiàn)為橫向有效褐墅,縱向無效
inline-block
- 這個東西叫行內(nèi)塊元素尉姨,可以通過display屬性來設(shè)置我擂。
- 該元素本質(zhì)上屬于塊級元素择吊,設(shè)置之后,可以使塊級元素從視覺上表現(xiàn)為行內(nèi)元素
inline-table
- 該屬性可將取消table換行攒庵,將其表現(xiàn)設(shè)置為與行內(nèi)元素一樣
list-item
- 將多個元素作為列表顯示嘴纺,同時可在開頭設(shè)置列表標(biāo)記
div{
display:list-item;
list-style-type:circle;
margin-left:10px
}
table的各種類型
- 這是一個MMP的類型
none
- 元素的display被指定為none之后元素將不會顯示
對盒子使用陰影
- 通過box-shadow對盒子設(shè)置陰影,具體用法與text-shadow完全相同(見上一篇博客)
box-sizing
- 該屬性用于指定盒模型大小是否指定范圍
- 可指定為content-box浓冒,表示該盒子的長寬僅指定內(nèi)容部分栽渴,為默認值
- 也可指定為border-box,表示盒子長寬包括內(nèi)邊距和邊框的厚度