網頁布局過程：
先準備好相關的網頁元素，網頁元素基本上都是盒子
利用css設定好盒子的樣式，並且將盒子擺放在合適的位置。
往盒子裡面裝內容：網頁布局的核心：利用css擺盒子。
border可以設定盒子得邊框，邊框有三個屬性（粗細，樣式，顏色）
屬性作用
border-width
設定邊框的寬度
border-style
設定邊框的樣式
border-color
邊框的顏色
border-collapse ：collapse
相鄰的**邊框合在一起
注意：在設定邊框是會改變盒子的實際大小，因此我們在設定盒子大小是應當減去盒子邊框的寬度。
設定盒子的內邊距，即內容和邊框之間的距離
屬性作用
padding-top
設定上內邊距
padding-bottom
下內邊距
padding-left
左內邊距
padding-right
右內邊距
padding簡寫屬性，一共四個
屬性含義
padding：1px
四個邊的內邊距
padding: 1px 2px
上下為1px,左右為2px
padding：1px,2px,3px
上內邊距為1px，左右為2px，下內邊距為3px
padding:1px,2px,3px,4px
上：1px,右：2px,下：3px，左：4px
同樣的內邊距也會影響到盒子的實際大小，再進行設定時要多出來的內邊距的大小不同的是如果盒子沒有設定width/height,這是padding不會影響到盒子的大小。
外邊距的屬性即簡寫屬性和內邊距一樣
margin可以將塊級盒子居中，方法如下：
1.設定盒子的寬度。
2.將盒子的左右外邊距設定為auto;
常見的有三種寫法，效果都一樣：
border-radius用來設定外邊框圓角
語法：
border-radius
:length;
box-shadow
:h-shadow,v-shadow,blur,spread,color,inset;
描述h-shadow
必需有，水平陰影的位置，可以為負數
v-shadow
必須有，豎直陰影的位置，可以為負數
blur
模糊距離
spread
陰影的尺寸（注意別和blue混淆了）
color
陰影的顏色
inset
內陰影（預設為**影）
用法同盒子陰影，但是沒有spread和inset兩個值。
css第三天 盒子模型
1邊框border 1.1顏色 color 1.2寬度 width 1.3樣式style solid dashed dotted 1.4例子 border 1px solid red 4個邊框都是紅色的實線 border top 1px dashed pink 2外邊距 2.1margin讓塊級盒子...
css盒子模型 CSS 盒子模型
css 盒子模型基本上是面試的必考題，因為實在是太重要了。以前寫 css 總是感覺元素的寬高十分難調，其中乙個很大的問題就是忽略了盒子模型的重要性。說到 css 盒子模型，你可能會說我知道呀，就是 margin 包 border,border 包 padding,padding 包 content ...
CSS總結三之盒子模型
html頁面中的布局元素看作是乙個矩形的盒子，也就是乙個盛裝內容的容器。屬性作用 border width 定義邊框粗細，單位是px border style 邊框的樣式 border color 邊框顏色 邊框的樣式 border 1px solid red 沒有順序很多情況下，我們不需要指定4個...