標題字：字型、大小、顏色
正文本：字型、大小、顏色
重點強調：顏色、字型樣式
控制字型：
指定字型：font-family:value1,value2;字型可寫多個，中間用逗號隔開，字型間的優先順序按照先讀到哪個就用哪個，第乙個字型沒有會查詢下乙個字型，如果使用者電腦裡所有字型都沒有，那麼就按照預設的字型來。中文要加雙引號，英文不要加。
字型大小：font-size：value 單位可為px,em,pt等
字型加粗：font-weight：normal/bold/value(克數)。預設情況下是不加粗的，如果想把預設是粗體的格式設定為不加粗，可以設定font-weight：normal；
字型樣式：font-style：normal/italic 設定是否斜體
小型大寫字母顯示：font-variant：normal/small-caps;會把頁面中所有的字母在顯示時都變成大寫字母，但是字型大小會比正常要小的。
字型選擇的原則：如果是中文，就用中文字型。標題或大字型大小的字用微軟雅黑。小字、正文本型用宋體。如果是英文或數字或英文符號，就用英文本型。arial：類似於中文裡的黑體，一般對應的中文設定為微軟雅黑；times：類似中文裡的宋體。
字型屬性font：可以只寫乙個font將所有屬性合在一起寫，和background類似，但是background不需要注意順序，但是font必須按照順序來寫，否則無法實現，另外color是不能寫在裡面的。為簡寫屬性，包含6個值，可以按順序設定：
font:font-style font-variant font-weight font-size font-family;不設定的值，則使用預設設定。
控制文字格式：
文字顏色：color:value;
文字修飾text-decoration：none/underline(下劃線)/overline（上劃線）
行高line-height：value；行高 如果是一整段文字，可以設定line-height來控制行距；如果是單行文字，可以行高=容器高，讓文字垂直居中。如果容器裡的文字只有一行，可以將行高設定為容器大小，從而實現文字快速垂直居中，用該屬性設定文字在容器中的垂直位置是好設定的，但僅限一行。
首行文字縮排text-indent：value。是對每個段落的首行進行縮排.縮排值要根據已經設定的文字大小來決定，也可以設定為2em，表示兩個字的縮排。如果在文字中加了
換行，第二行是沒有首行縮排的，要實現第二行也是首行縮排，需要使用來實現換行。
文字陰影text-shadow：h-shadow v-shadow blur color；類似於box-shadow
letter-sapcing和word-spacing定義字間距，前者可以定義中英文，後者只能定義英文
溢位：處理空白：white-space：normal/nowrap（不換行）;決定是否自動換行
文字溢位：text-overflow：clip(截掉，預設)/ellipsis（在文字後新增...，需要與overflow：hidden配合使用）；
注：1）text-overflow要與overflow:hidden;連用才有效果
2）white-space:nowrap;漢字和英文遇到邊框會自動換行，但是如果是英文單詞很長很長遇到邊框是不會換行的，下乙個單詞會正常顯示在下一行
文字溢位只是針對英文長單詞的，對中文不起作用。如果用傳統的overflow：hidden來處理，就會直接把文字給截掉了，所以要用專門的文字溢位設定。將white-space設定為normal，英文依然是英文的處理，中文依然是中文的處理（英文不換行中文還是會自動換行），如果將white-space設定為nowrap，中文也會換行。如果設定text-overflow：clip，就會直接裁減掉，如果設定text-overflow：ellipsis,在後面會出現省略的三個點...
注：要想讓裁剪後的效果顯示出來，必須將overflow設定為hidden
長單詞換行屬性：針對的是英文
word-wrap:normal（正常，長單詞不換行）/break-word（該換行就換行，不管乙個單詞是否顯示完整）
文字換行：
word-break（單詞可以換**況下使用）:normal(第一行顯示不下會將單詞自動換行)/break-all （不管單詞是否完整，能塞幾個就幾個，塞不下的換行）/keep-all不換行
注：關於word-break：
normal：使用瀏覽器預設的換行規則
break-all：允許在單詞內換行
keep-all：只能在半形空格或連字元處換行
html給table加邊框單元格也有邊框，border css給table加邊框，只能給它加外框，不能給單元格加邊框，要加內框需要使用父代選擇器
html裡用cellspacing和cellpadding來控制內容間距
css裡用padding來控制
css**常用樣式屬性：
1.邊距屬性：padding
2.尺寸屬性：width，height
3.文字格式化屬性
4.背景屬性：背景色或背景影象
5.border屬性：**邊框
css中table的垂直方向對齊：vertical-align屬性，取值和html中的align一樣。margin在**裡不好用。
border-collapse：邊框合併，不是td的屬性，是table的屬性。在html中將padding設定為0邊框還是比較粗的，但是在css中用border-collapse邊框就比較細了，也就是單線邊框效果。
border-collapse：separate/collapse
另外，如果設定單元格的border-bottom:transparent，底部的單元格邊框還是存在的，因為border-collapse：collapse是乙個單元格的下邊框和另乙個單元格的下邊框重合了，但並不代表不存在了，設定了下邊框不存在，但是另乙個單元格的上邊框還是存在的。
border-spacing：邊框邊距，這個是**中margin實現不了的。但是border-collapse：collapse時，是單線邊框，此時border-spacing顯示不出來的。border-spacing可以定義乙個值也可以定義兩個值，定義乙個值表示所有的邊距都是一樣，如果定義兩個不同值，表示橫向邊距和縱向邊距不一樣
caption-side設定**位置：caption- side:top（預設）/bottom
在html中預設情況下caption是位於表頭的，只在上面
table-layout用來設定顯示**單元格、行、列的演算法規則。在預設情況下，如果設定了單元格大小，但是當單元格裡面的內容超過了單元格大小，**會自動進行計算，此時單元格的大小還是會發生改變的。可以使用table-layout來解決，可取值：auto（預設，這種情況下效率比較低，因為要進行計算大小），fixed（規定多大就多大，大小不會發生改變，缺點是不夠靈活）。如何選擇table-layout的值要看專案的使用情況。另外在table-layout：fixed時，可以設定ouverflow:hidden，然後設定text-overflow為...，同時在單元格中新增title屬性就能看到完整數字又能提高效率。table-layout屬性是用來解決一長串數字或一長串英文單詞時使用，對漢字不起作用，中文不會把單元格撐開的。
td的邊框色會覆蓋掉table的邊框色，但並不代表table的邊框色不存在
是表頭標籤，預設情況下會居中並加粗
span容器針對文字
i容器針對小圖示
樣式裡內聯元素不能定義寬和高，應該使用padding
定位：定義元素框相對於其正常位置應該出現的位置，或者相對于父元素、另乙個元素甚至瀏覽器視窗本身的位置。普通流定位、浮動定位、相對定位、絕對定位。
普通流定位：
頁面中的塊級元素框從上到下乙個接乙個地排列，每乙個塊級元素都會出現在乙個新行中，如元素，元素。元素框之間的垂直距離是由框的垂直外邊距計算出來的。
內聯元素將在一行中從左到右排列水平布置，不需要從新行開始，可以使用水平內邊距、邊框和外邊距調整他們的間距
浮動定位：用來解決同一行中不能排兩個塊元素的問題。設定了浮動的元素會把沒有設定浮動的元素給蓋住。如果設定了浮動都為left，那麼塊元素會從左到右依次排列，如果兩個元素都為right，那麼將會從右到左依次排列。在外層元素沒有設定高度時，缺省會隨著內容擴充套件，但是如果裡面的元素都設定成了浮動，那麼外層元素就沒有高度了，此時可以將外層容器的overflow設定為hidden來解決問題。
浮動元素的外邊緣不會超過其父元素的內邊緣，浮動元素不會互相重疊，浮動元素不會上下浮動。浮動元素中浮動的是框，裡面的內容被擠出來還在原來的位置，不會與其他東西發生重疊。
float屬性語法：float:none/left/right;
clear:left/right/both;清除元素，定義元素什麼地方不允許出現浮動框。
總結：
浮動：
預設情況下，塊元素是按照標準流排列的。如果給元素設定浮動，元素就會跳出標準流。
float：left 浮到左邊 right 浮到右邊
設定浮動的元素周圍沒有浮動的元素會上移與浮動元素元素重疊。浮動會卡住，影響浮動效果的因素很多，所以以實際效果為準。
當子元素全部為浮動元素時，父元素不會自動適應高度
可以為父元素新增overflow：hidden解決該問題
解決浮動造成的布局混亂：clear
clear定義的是元素的哪一邊不允許出現浮動元素，left、right、both
CSS3基礎知識彙總
css3樣式表優勢 1 豐富的修飾樣式 2 內容與修飾分離，利於專案開發 3 實現樣式復用，提高開發學歷 4 實現頁面的精準控制 css3語法 type text css listyle 3.樣式表分類 1 外部樣式表 head 其中rel stylesheet 表示在網頁中使用該外部樣式表，typ...
css3基礎知識 回顧
1.屬性選擇器 完全匹配的屬性選擇器 id article 示例 結果 前兩文字框的邊框為兩畫素紅色。包含匹配元素選擇器，包含制定的字串。語法 attribute vlue attribute指的屬性名，value 指的是屬性值。示例 css3鞏固學習 css3鞏固學習 css3鞏固學習 結果 第乙...
css3的基礎知識
transfrom的應用 1.旋 transform rotate 30deg 2.陰影效果 box shadow 10px 10px 5px 888888 3.滑鼠移入放大 transform scale 2,2 放慢變化的時間效果 transition transform 想要實現的屬性 6s，...