常見的布局

流布局:

1.main設定margin-left和margin-right

2.left浮動在左邊

3.right浮動在右邊

.left 

.right 
.main 

1.contain設定margin-left,margin-right,main寬度100%

2.left浮動在左邊

3.right浮動在右邊

.container 

.main 
.left 
.right 

1.content浮動在左邊

2.main設定margin-left,margin-right

3.left浮動在左邊

4.right浮動在右邊

.content 

.main 
.left 
.right 

常見的布局方式

一 靜態布局 static layout 布局概念 最傳統 原始的web布局設計。網頁最外層容器 outer 有固定的大小,所有的內容以該容器為標準,超出寬高的部分用滾動條 overflow scroll 來實現滾動查閱。優點採用的是css2之前的寫法,不存在瀏覽器相容性。布局簡單。缺點但是移動端不...

常見布局實現

行內元素 tex align center 給定寬度的塊級元素 margin 0 auto 未知寬度的塊級元素 container flex布局有很多妙用，這裡就不一一枚舉了，大家感興趣可以看看下面這篇教程 另外值得注意的是行內元素也可以設定為flex，dispaly inline flex 對於行...

CSS常見布局

一 聖杯布局 雙飛翼布局 布局特點 左右兩欄固定寬度，中間部分自適應 三列等高 實現乙個左邊100px右邊150px中間自適應的布局 先來看看效果圖 這是top 這是left 這是content 這是多行高度！這是right 這是foot 過程說明 1.先寫乙個基本布局 2.將中間left cont...