rgba:紅、綠、藍、不透明度
rgba（89，0，127，0.4）;hsl(282,100
%,25
%);hsl(282,100
%,25
%,.75);
有all、aural、braille、handheld、print、projection（投影裝置）、screen、tty、tv
@media printp}
//元素的名稱
h1//元素所在上下文
h1em
//類.error
//id
#gaudi
//名稱和類
strong
.error
//偽類
a:link
//屬性
a[title]
//屬性和屬性值
a[href=""]
.architect > p
//只有直接跟在同胞p元素後面的p元素顯示為紅色
.architect
p+p
//會讓任何屬於同一父元素的同胞h1後面的h2元素顯示為紅色
h1~h2｛
color：red；
｝
li：first-child
li：last-child
p：first-line
p：first-letter
/*順序*/
li:nth-child(3)
/*逆序*/
li:nth-last-child(2)
/*分組設定簡寫*/
li:nth-child(4n+1)
/*奇*/
li:nth-last-child(odd)
/*偶*/
li:nth-last-child(even）
/*只計算同型別的元素*/
h2:nth-of-type(odd)
//是html並不存在的元素，並未在html中作相應的標記，是另乙個元素的部分內容
：：first-line
/*第一行*/
：：first-letter/*第乙個字母*/
：：before
/*在某元素之前加*/
：：after
/*在某元素之後加*/
//應用於一組html元素，無需用類標記，不用寫出class="first-child"
//新的、未訪問的
a:link
//訪問過
a:visited
//獲得焦點（通過tab鍵）
a:focus
//滑鼠指標停留
a:hover
//啟用時
a:active
[attribute]
//指定屬性
[attribute="value"]
//完全匹配屬性值
[attribute~="value"]
//匹配以空格分隔的多個單詞，包括完全匹配指定值
artcle[class~="barcelona"]
[attribute|="value"]
//以value-開頭
h2[lang|="es"]
[attribute^="value"]
//以value開頭，為完整的單詞或單詞的一部分
//以value結尾，為完整的單詞或單詞的一部分
img[src="logo.png"]
[attribute*="value"]
//至少包含value一次的元素，不必是屬性值中的完整單詞，為指定值的子字串
允許根據文件中的結構來指定元素樣式
/*根元素*/
:root
/*排除子元素*/
div *:not(h1)
/*內容為空白時*/
：empty
/*跳轉*/
:target
css3中，有17種ui元素偽類選擇器
/*滑鼠浮動*/
input
[type="text"]
:hover
/*獲得焦點*/
input
[type="text"]
:focus
/*滑鼠按住不放*/
input
[type="text"]
:active
/*選中*/
Html5與CSS3新特性
新增的語義化標籤 新增的多 標籤 音訊標籤 檔案位址 video 檔案位址 audio 屬性 屬性屬性值 描述autoplay autoplay control control loop loop muted muted 新增的input表單type型別 新增的表單屬性新增屬性選擇器 權重為10，注...
HTML5與CSS3基礎（五）
16表單 16.1輸入和元素 16.2建立表單 每個表單都已form開始標籤開始，以form結束標籤結束。兩個標籤之間是組成表單的說明標籤 控制項和按鈕，每乙個控制項都有乙個name屬性，用於在提交表單時對資料進行識別。form開始標籤可以有一些屬性，其中最重要的就是action和method ac...
css3和html5的基礎
流式布局 應對視窗大小做等比例縮放布局 簡單來說利用百分數來進行布局 css3的box sizing與calc 通常設定邊框會被設定在元素的外圍 box sizing屬性值設為border box時邊框就加在元素內部 css3中在進行響應式布局時需要對不不同的螢幕大小設定不同的div排序方式。這時候...