什麼是標準文件流
瀏覽器在解析頁面的時候，從上到下從左到右這樣的乙個解析過程，被稱為標準文件流。
標籤的分類（二）行塊的特點容器級別：h1~h6 ol ul dl li dt dd table div
文字級別：p img a input label select textarea span
塊級標籤：h1~h6 ol ul dl li dt dd table div p
行內標籤：img a input label select textarea span
塊級標籤：
塊級標籤相當霸道，如果不設定寬和高，那麼它的寬將是它爹的寬，它的高將是內容撐開的高，如果設定寬和高，那麼它的寬和高將是設定的寬和高。就算設定了寬高，它還是霸道的佔據它爹的一行。
行內標籤：
行內標籤非常懦弱。如果不設定寬高，那麼它的寬和高都是由內容撐開的。如果設定了寬和高，行內標籤也不會理睬，它的寬和高還是內容的寬和高。也就是說，行內標籤的寬和高無論在什麼時候都是由內容所決定的。行內標籤它不會獨自的佔據它爹的一行，如果幾個行內標籤在一起，那麼它們會併排一行。只有它爹的寬不夠它們併排的時候才會換行。
可置換行內標籤和不可置換行內標籤：
可置換元素雖然是行內標籤，但是他也可以設定寬和高，比如img input textarea，不可置換元素無法設定寬和高。
行塊轉換：
如果想要乙個塊級標籤當做行內去用，那麼可以給這個塊級標籤新增display：inline這樣的話，這個塊級標籤就會變成行內標籤，它的特點也就和行內標籤無異了。
如果想要乙個行內標籤當做塊級去用，那麼可以給這個行內標籤新增display：block這樣的話，這個行內標籤就會變成塊級標籤，它的特點也就和塊級標籤無異了。
盒子模型包含4部分內容，盒子的大小最終由這四部分決定：
內容區域外邊距的表示方式邊框內邊距
外邊距
綜合表示法（上 右 下 左）
margin：100px；代表上下左右都是100px；margin：100px 50px；代表上下100px，左右50px；
margin：100px 50px 30px：代表上100px 右50px 下30px 左50px；
margin：100px 50px 30px 20px：代表上100 右50 下30 左20；
按照方向去設定
margin-top：100px；margin-right：100px；
margin-bottom：100px；
margin-left：100px；
內邊距的表示方式
參照外邊距
邊框的設定方式
綜合設定法：
border：1px solid red；綜合設定四個邊的邊框。
按照方向綜合設定
border-top：1px solid red；border-right：2px dashed green；
border-bottom：5px dotted yellowgreen；
border-left：10px double blue；
按照屬性來綜合設定
border-width：1px 2px 3px 4px；border-style：solid dotted dashed double；
border-color：red green blue black；
按照方向和屬性來設定
border-top-width：10px；border-top-style：dotted；
border-top-color；red；
行內元素垂直方向上margin和padding失效；
在標準文件流當中，垂直方向margin有塌陷現象；
文字在盒子當中水平居中，text-align：center；
單行文字在盒子正中心，text-align：center；line-height=盒子高度；
盒子在盒子中水平居中，margin：0 auto；
margin描述的是兄弟的關係，padding描述的是父子的關係，在碰到父子之間間距問題的時候，要善於運用父親的padding而不是兒子的margin。當運用父親的padding把兒子往下擠完了以後，父親會默默的變大，這會我們要去精確還原父親的盒子的大小。什麼方向上padding了就在什麼方向上減小內容的區域，這就是精確還原盒子。
1 vertical-align：middle
vertical-align只能用在行內標籤上。
通常情況用在和文字併排在一行的時候，預設是底部和行內基線對齊的（就是文字底部），想要讓文字排在中線位置，就要對新增vertical-align：middle；讓中線預設和行內基線對齊。
2 字間距和詞間距
3 首行縮排
首行縮排：text-indent：2em；
4 background-image
background-repeat：no-repeat；
當引入背景後，預設背景是重複平鋪的，x軸和y軸同時重複。但是我們一般不讓背景重複，所以常需要設定這個屬性為no-repeat；如果僅僅想在x軸方向重複可以設定為repeat-x；如果僅僅想在y軸方向重複可以設定為repeat-y；
background-size：100% 100%；這個屬性用來設定背景的大小，通常情況我們是讓背景恰好和盒子一樣大小。這個屬性可以設定兩個值，表示的是背景的寬和高。寬和高可以用px，也可以用其它的大小單位表示。
這個屬性還有乙個值，乙個cover 乙個contain；
cover是覆蓋的意思，它會等比縮放我們的，當恰好覆蓋住盒子為止，如果大了就會被裁掉。（以盒子為參考）
contain是包含的意思，它也會等比縮放我們的，當盒子恰好能夠包含這張的時候為止。這個可能縮放的比盒子小，也就是說可能會比盒子小。（以為參考）
background-position：100% 100%；
這個屬性非常重要，後面我們在學習css精靈圖（雪碧圖）的時候也要用到這個屬性，它是背景定位的意思。
前端複習筆記3 css 1
css全稱 cascading style sheet 就是層疊樣式表的意思。css就是為了裝飾我們的網頁，讓我們的網頁看起來漂亮。從語義的角度去描述網頁的結構 html 從審美的角度去描述網頁的樣式 css 從互動的角度去描述網頁的動效 js css由兩部分組成 選擇器 屬性 屬性 font fa...
前端複習記錄（前端基礎 CSS）二
修改父元素的color屬性 line height一般是指布局裡面一段文字上下行之間的高度，是針對字型來設定的，height一般是指容器的整體高度，background color設定的背景顏色會填充元素的content padding border區域 margin的外邊緣 聖杯布局是指布局從上到...
CSS複習總結（2）
接上週，繼續複習css css主要是對網頁樣式的修改，比如字型大小顏色的設定等等，也可以通過一些標籤起到批量修改的效果，css樣式由選擇符和宣告組成，宣告又由屬性和值組成。如p，是將網頁中所有段的字型大小變為20px，顏色變為紅色。在之間插入css 的一種格式，可以與span連用以達到修改特定字元的...