一、首先要了解什麼是塊級元素與行級元素
塊級元素
會占領頁面的一行，其後多個block元素自動換行、 可以設定width，height，設定了width後同樣也占領一行、同樣也可以設定 margin與padding屬性。
ps:常見的塊級元素:div,img,ul,form,p等
行級元素
與其他元素在同一行上，高度，行高以及底邊距不可改變，高度就是內容文字或者的寬度，不可以改變。
ps：em，strong，br,input等
display:inline-block，block，inline元素的區別
1、display：block將元素顯示為塊級元素，從而可以更好地操控元素的寬高，以及內外邊距，每乙個塊級元素都是從新的一行開始。
2、display : inline將元素顯示為行內元素，高度，行高以及底邊距不可改變，高度就是內容文字或者的寬度，不可以改變。多個相鄰的行內元素排在同一行裡，知道頁面一行排列不下，才會換新的一行。
3、display：inline-block看上去值名inline-block是乙個混合產物，實際上確是如此，將元素顯示為行內塊狀元素，設定該屬性後，其他的行內塊級元素會排列在同一行。比如我們li元素乙個inline-block，使其既有block的寬度高度特性，又有inline的同行特性，在同一行內有不同高度內容的元素時，通常要設定對齊方式如vertical-align: top;來使元素頂部對齊。
**：
前端開發常用css居中布局
在前端開發中，經常會碰到布局需要左右居中，上下居中的情況，在現代瀏覽器中實現居中還是挺方便的，本文只考慮在高版本現代瀏覽器中的情況，不考慮ie.這是常用的水平居中，按鈕，文字等行內元素的方法，但不能上下居中 abcedd 實現效果 此方法也只能實現水平居中，具體用法為 margin 0 auto.s...
CSS中的position和display通俗理解
背景 一直對css中的position和display懵懵懂懂，這幾天查了一下，結合自己理解，通俗解釋如下。1 position屬性 主要分為absolute和relative。其中好理解的static為預設值，按照在html文件中順序顯示 fixed為以瀏覽器為參照。我們知道是所有元素的父節點。在...
前端css布局之BFC
哈嘍，各位小夥伴好！今天來整理下前端關於css布局的乙個知識點 bfc block fomatting context 如果知識點梳理有出錯的地方，望夥伴們幫忙指出，一起進步 bfc 可以理解為建立乙個布局容器，容器裡按自己的方式來布局，且與容器外界的元素互不影響。wrap fl div 這是div...