列表及行塊轉變
阿新 • • 發佈:2018-09-13
修改 ott none width 列表 無序列表 轉變 list mar
並集選擇器
body,ul,p{
margin:0;
padding:0;
}
好處:簡單方便
壞處:太過方便,加大了瀏覽器的負荷
解決辦法:按需選擇
無序列表
ul
無序列表中都必須帶有兩個子標簽<li></li>
ul天生自帶內外邊距 還有p標簽
list-style 這是樣式屬性 除去前面的符號
list-style 的屬性值circle(空心圓) disc(實心圓) square (正方形)none(空)
有序列表
ol
有序列表中帶有兩個子標簽<li></li>
天生自帶內外邊距
ol和ul的不同之處在於前面的符號不同
有序列表改變前面符號需在標簽內添加type修改
自定義列表
dl自定義列表 dt小標題 dd內容
列表能做什麽?
做二級菜單 導航欄
一個元素實際占用的空間:width+2*margin+2*padding+2*border
實際高度:height+padding-top+padding-bottom+2*border
塊級轉行級
給塊級元素添加屬性display:inline dosplay顯示 inline行
行級轉塊級
給行級元素添加屬性display:block block塊
行級塊元素
給需要的元素添加屬性 display:inline-block
可以設置寬高 可以在一行 margin可以隨便使用了
列表及行塊轉變