這是我的第二篇部落格，h5教程css入門，適合剛開始學習h5的新手，讓我們共同進步。
css稱為樣式層疊表，是用於增強或控制網頁樣式，並允許將樣式資訊與網頁內容分離的一種標記性語言。
1.為了方便樣式的復用，方便**後期維護。
2.為了達到頁面的精準控制，實現精美複雜的頁面。
簡單點說，css就是為了讓你的網頁更加好看。前面學的html相當於你買了乙個毛坯房，雖然結構有了，但是實在是太難看了，不能住人，所以你就需要css來給你裝修一下。
<div
style
="all: inherit;"
>
div>
1.將css樣式與html**，完全糅雜在一起，不符合w3c關於"內容與表現分離"的基本規範，不利於後期維護。
2.優先順序最高，但是不推薦使用。
<style
type
="text/css"
>
style
>
1.一定程度的將css樣式與html**分離，但是分離不夠徹底，無法實現樣式復用。
2.優先順序低於行內樣式表。
<link
rel="stylesheet"
type
="text/css"
href
="02.應用css的三種方法.css"
/>
1.實現了css樣式與html**的徹底的分離，符合w3c的規範，方便樣式復用與維護。
2.優先順序低於內部樣式表。
3.以後開發推薦使用。
<style
type
="text/css"
>
@import url("02.");
style
>
【兩種匯入方法的區別】
1.link標籤是標準的html標籤，而import不是。
2.link可以連線各種樣式的檔案，而import只能匯入css檔案。
3.link使用的是鏈結的方式，相當於html與css檔案的橋梁。
import使用的是匯入的方式，會在文件載入時，將css的**匯入到html中。
4.link在網頁邊載入的時候邊鏈結css檔案，而import會在網頁完全載入之後，在匯入css檔案。
1.寫法：html標籤名
2.作用選中頁面中所有對應的標籤。
1.寫法：.選擇器名稱{}
呼叫：在需要修改樣式的標籤上，使用class="選擇器名稱"，呼叫對應選擇器。
2.作用：修改所有呼叫選擇器的標籤。
3.優先順序高於標籤選擇器。
1.寫法：#選擇器名稱{}
呼叫：在需要修改樣式的標籤上，使用id="選擇器名稱"，呼叫對應選擇器。
2.id是唯一的，同一頁面只能有乙個id
3.優先順序大於class選擇器。
1.寫法：*{}
2.作用：選中頁面中所有標籤。
3.優先順序最低。
1.寫法：選擇器1 選擇器2 選擇器3...{}（中間加空格）
例子：div .li{}需滿足，div裡面的class="li" 的元素。可以是子代，也可以是後代。
1.寫法：選擇器1>選擇器2>選擇器3...{}（大於號隔開）
例如：div>ul{}則ul必須是div的直接子代。
2.優先順序：近者優先，越精確越優先。
1.寫法：選擇器1選擇器2...{}（中間什麼都不寫）
例如：.li#li{}元素必須同時具備class="li",id="li"才能生效。
1.寫法：選擇器1,選擇器2...{}（用逗號隔開）
例如：.li,#li{}元素只要具備class="li"或者id="li"就能生效。
1.寫法：選擇器名稱：偽類狀態{}
2.常用偽類狀態
link：未訪問狀態
visited：已訪問狀態
hover：滑鼠之上狀態
actived：啟用選定狀態
focus：獲得焦點（input常用）
3.超連結多種偽類共存時順序：
link（visited）hover actived
4.使兩個控制項同時對滑鼠事件做出反應的寫法：
共同父容器選擇器：偽類狀態 控制項選擇器
doctype html
>
<
html
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>css常用選擇器
title
>
<
style
type
="text/css"
>
li/*
【標籤選擇器】
* 1.寫法：html標籤名
* 2.作用選中頁面中所有對應的標籤。
*/.li
/*【類選擇器】
* 1.寫法：.選擇器名稱{}
* 呼叫：在需要修改樣式的標籤上，使用class="選擇器名稱"，呼叫對應選擇器。
* 2.作用：修改所有呼叫選擇器的標籤。
* 3.優先順序高於標籤選擇器。
*/#li
/** 【id選擇器】
* 1.寫法：#選擇器名稱{}
* 呼叫：在需要修改樣式的標籤上，使用id="選擇器名稱"，呼叫對應選擇器。
* 2.id是唯一的，同一頁面只能有乙個id
* 3.優先順序大於class選擇器。*/*
/*【通用選擇器】
* 1.寫法：*{}
* 2.作用：選中頁面中所有標籤。
* 3.優先順序最低。
*/div li
/*【後代選擇器】
* 1.寫法：選擇器1 選擇器2 選擇器3...{}
* 例子：div .li{}需滿足，div裡面的class="li" 的元素。可以是子代，也可以是後代。
* 【子代選擇器】
* 1.寫法：選擇器1>選擇器2>選擇器3...{}
* 例如：div>ul{}則ul必須是div的直接子代。
* 2.優先順序：近者優先，越精確越優先。
* 【偽類選擇器】
* *
* */.li#li
.li,#li
a:link
a:visited
a:hover
a:active
input:hover
input:active
input:focus
style
>
head
>
<
body
>
<
div>
<
ul>
<
li class
="li"
id="li"
>列表第一項
li>
<
li>列表第二項
li>
<
li class
="li"
>列表第三項
li>
<
li id
="li"
>列表第四項
li>
ul>
div>
<
ul>
<
li class
="li"
>列表第一項
li>
<
li>列表第二項
li>
<
li class
="li"
>列表第三項
li>
<
li id
="li"
>列表第四項
li>
ul>
<
a href
="03.css常用文字屬性.html"
target
="_blank"
> this is a chaolianjie
a>
<
input
type
="text"
name
="text"
id="text"
/>
body
>
html
>
2.2.1選擇器的優先順序
1.第一原則：近者優先，最內層選擇器要大於外層。
例如： div ul li>div #ul li在ul 內層，所以li標籤選擇器能覆蓋#ul id選擇器
2.當作用在同一層時，id選擇器》class選擇器》標籤選擇器。
例如：div #li>div .li>div li。只要最後乙個選擇器都作用與li 那麼無論之前有多少巢狀，均沒有選擇關係。
3.當作用於同一層，而且最後一層為同等選擇器
例如：div ul li>div li作用範圍選的更精準，則優先順序更高。
4.當優先順序完全相同時，寫在後面的選擇器會覆蓋選在後面的選擇器。
2.2.2選擇器的命名規範
1.只能使用字母數字下劃線。
2.開頭不能是數字。
H5新特性 CSS選擇器
是在原先的css基礎上延伸出來的，為了更方便 快捷的選中元素，有利於開發人員的開發 div class box box style display inline block div box a style display inline block div box po style display i...
H5萬能選擇器 iosselect
iosselect是個什麼東西？移動端瀏覽器對於select的展示樣式是不一致的，ios下是類似原生的picker，安卓下各瀏覽器展示各異，我們需要乙個選擇器元件來統一各端下各種瀏覽器的展示。下面是它的乙個截圖 文件和demo可以訪問github iosselect能做什麼？移動端開發中，經常遇到選...
CSS選擇器 二
繼上篇繼續.link visited,active,hover 之前一直認為屬於一組選擇器對a標籤進行操作,但實際上細分來看他們分別是三種型別的選擇器,通常給a標籤四種都加時的順序按照 l,v,h,a 來 否則會產生覆蓋有樣式會不生效 div target style target test tar...