復合選擇器
字型屬性
文字屬性
css 設定文字內容（字型，大小，對齊方式），的外形（寬度，邊框樣式，邊距），版面的布局和外觀顯示樣式 css美化html 讓html專注於結構
css由兩部分構成 選擇器+一條或多條宣告
css選擇器
又分基礎選擇器和復合選擇器兩大類
基礎選擇器
由單個選擇器構成，又包括標籤選擇器，id選擇器，類選擇器，統配符選擇器
標籤選擇器
將同型別標籤全部選擇出來
類選擇器
開發中最常用的一類選擇器 ，誰去使用，就去呼叫該類名
多類名
乙個標籤可以包含多個類名 每個類名對應乙個職責，減少耦合性，剝離，增加利用率（我的想法是，類內的屬性越少，利用率也越高，那麼可不可以把原始的屬性都看作乙個類，而我們的工作就是將這些乙個個的類進行二次整合，方便我們呼叫，所以這就要求我們仔細思考，合理分配內容）
id選擇器
唯一性，雖然也可以在多個中呼叫…但違背了原則，因為id是標識性的，這樣在後續中方便與js搭配使用
萬用字元選擇器
選中所有的元素標籤
復合選擇器
復合選擇器是對普通選擇器進行組合行成的，包括後代選擇器，子選擇器，並集選擇器，偽類選擇器等（將所選的元素縮小在一定範圍，減少類名的使用）
後代選擇器
可以選擇父元素裡的子元素，可以是兒子，也可以是孫子，只要是後代 可以層層巢狀，也可以直接定位，即中間間隔各個輩分
語法 ：用空格隔開
父標籤 子標籤 子標籤… ｛樣式宣告｝
對應位置也可以用標籤的類名或id進行代替
如
.center a
只能選擇最近一級的子標籤，也就是兒子
後代選擇器與子選擇器區別
class
="center"
>
href
="#"
>
12345a
>
>
href
="#"
>
北京晚報官網a
>
span
>
type
="text"
placeholder
="請輸入查詢的條件"
>
>
搜尋button
>
div>
.center a
如果是子選擇器
.center > a
並集選擇器
選擇多組標籤，為他們定義相同的樣式
語法元素1,元素2｛｝
如ul, ol
偽類選擇器
主要特徵是有冒號
鏈結偽類選擇器
a:link 選擇未被訪問的鏈結
a:visited 選擇已經被訪問過的鏈結
a:hover 選擇滑鼠指標懸停時的鏈結
a:active 選擇滑鼠按下但未鬆開的鏈結
注意這四個順序不能顛倒，否則會失效
a標籤需要單獨指定樣式
開發中最常用的是用a定義初始樣式，用a：hover定義懸停狀態即可
：focus偽類選擇器
選取獲得焦點的表單元素
字型屬性
字型系列
font-family
:'microsoft yahei','宋體',arial, helvetica, sans-serif;
寫多個字型是為了保持良好的相容性，瀏覽器會從第乙個開始識別，如果可是識別，則顯示，如果無法識別，則繼續向後識別，類似備胎。。。如果都找不到，就會使用瀏覽器預設的字型
可以直接在body標籤選擇器中直接放入font-family屬性
字型大小
font-size
: 100px;
谷歌瀏覽器預設畫素為16px
字型粗細
font-weight
: bold;
font-weight 其他屬性值：
normal | bold | bolder | light | 數字（不需要單位，100~900）
400等同於normal，700等同於bold ，實際開發中一般用數字
字型樣式
font-style
: italic;
italic | normal
em標籤也可以傾斜字型
字型的復合屬性
/* font: font-style font-weight font-size/line-height font-family; */
font
: italic 700 16px/20px 'microsoft yahei'
不需要的屬性可以省略，但必須保留font-size和font-family
文字屬性
文字屬性定義文字的外觀，比如文字的顏色，對齊文字，裝飾文字，文字縮排，行間距等
文字顏色
color
: red;
預定義的顏色，如red，green，deeppink等
十六進製制顏色 #cc00ff
rgb**：rgb(255,0,0) rgb(100%,0%,0%)
(red green blue)原生三色
對齊文字
text-align
: center;
裝飾文字
text-decoration
: underline;
屬性值：
none 預設無裝飾
underline 下劃線 a標籤自帶下劃線
overline 上劃線
line-through 刪除線
文字縮排
text-indent
: 10px;
也可以用em單位
em是相對單位，相對是指相對於當前文字大小，1em等於乙個文字的大小，如果當前沒有設定大小，則會按照父元素1個文字的大小
行間距
line-height
: 10px;
重頭學習html5 css3系列筆記（7）
ps切圖 可以使用box shadow屬性 box shadow h shadow v shadow blur spread color inset 專案value h shadow 必需 水平陰影的位置，允許負值 v shadow 必需 垂直陰影的位置，允許負值 blur 可選 模糊距離 spre...
菜鳥學習HTML5 CSS3（一）
主要內容 1.新的文件型別宣告 dtd 2.新增的html5標籤 3.刪除的html標籤 4.重新定義的html標籤 一 新的文件型別宣告 dtd html 5的dtd宣告為 等也是正確的，因為html語法是不區分大小寫的。在編寫html5文件時，要求指定文件型別，以確保瀏覽器能在html5的標準模...
初學HTML5 CSS3動畫
乙個完整的css animations由兩部分構成 在css3中使用 keyframes規則來建立動畫，keyframes可以設定多個關鍵幀，每個關鍵幀表示動畫過程中的乙個狀態，多個關鍵幀就可以使動畫十分絢麗。keyframes animationname animation屬性用於描述動畫的css...