css3基本選擇器詳解，css選擇器加是什么？

css選擇器加.是類選擇器，選擇與class屬性相匹配的類名

想學(xué)前端開發(fā)應(yīng)該從哪里入門？

1.HTML5+CSS3

掌握HTML基本語(yǔ)法; 掌握HTML常用標(biāo)簽及屬性; 掌握HTML語(yǔ)義化

掌握CSS語(yǔ)法及使用技巧; 掌握DIV+CSS布局方法; 掌握瀏覽器常見兼容性解決方案

掌握PS基礎(chǔ)知識(shí)、切圖及插件切圖; 掌握瀏覽器調(diào)試工具的使用方法; 掌握網(wǎng)站重構(gòu)開發(fā)基本流程和規(guī)范; 掌握語(yǔ)義化、模塊化、兼容性的PC端網(wǎng)站重構(gòu)

掌握HTML5新增的結(jié)構(gòu)化標(biāo)簽; 掌握HTML5瀏覽器兼容方式

掌握CSS3新增的選擇器; 掌握CSS3新增的樣式屬性; 掌握彈性盒布局方法及技巧; 掌握Animate動(dòng)畫庫(kù)使用方法

掌握Less的使用方式; 掌握Less的常用語(yǔ)法

掌握移動(dòng)端屏幕適配的解決方案; 掌握設(shè)備系統(tǒng)不同的解決方案; 掌握移動(dòng)端重構(gòu)常見的兼容問題解決方案

掌握響應(yīng)式布局適用場(chǎng)景; 掌握實(shí)現(xiàn)響應(yīng)式布局的解決方案

2. JS交互設(shè)計(jì)

掌握J(rèn)avaScript的基本語(yǔ)法； 掌握J(rèn)avaScript內(nèi)置對(duì)象； 掌握J(rèn)avaScript常見算法； 掌握J(rèn)avaScript函數(shù)應(yīng)用

掌握DOM的各種操作； 掌握BOM的各種操作

掌握J(rèn)avaScript事件的對(duì)象； 能夠熟練使用正則表達(dá)式進(jìn)行表單驗(yàn)證； 掌握閉包的應(yīng)用場(chǎng)景及優(yōu)缺點(diǎn)； 掌握AJAX的實(shí)現(xiàn)原理及封裝

熟練使用面向?qū)ο笏枷脒M(jìn)行編程

掌握項(xiàng)目的開發(fā)流程； 掌握音頻視頻常用API使用； 熟練使用WebAPIs編程

掌握Touch.js在移動(dòng)端的應(yīng)用

熟悉jQuery常見操作； 熟悉jQuery DOM操作； 掌握jQuery核心API

掌握Z(yǔ)epto的使用方法

3.Node

掌握ES6新特性； 掌握模板字符串用法； 掌握解構(gòu)賦值用法； 掌握箭頭函數(shù)用法； 掌握Promise、async...await用法； 掌握ES6 class用法

掌握Node特性； 掌握Node操作文件和目錄； 掌握Node搭建服務(wù)器； 掌握前后臺(tái)交互過程

掌握Express的用法； 掌握Express的路由配置； 掌握Express的內(nèi)置中間件使用； 掌握Express的常見第三方中間件使用； 掌握Express渲染視圖模板

掌握MySQL數(shù)據(jù)庫(kù)設(shè)計(jì)規(guī)范； 掌握MySQL之CURD操作指令； 掌握Node操作MySQL； 掌握MVC和MVP概念

掌握Webpack打包項(xiàng)目過程； 熟悉Gulp用法； 掌握ES6和commonjs模塊化用法

掌握WebSocket； 熟悉Koa2的用法

掌握接口設(shè)計(jì)規(guī)范； 掌握權(quán)限系統(tǒng)設(shè)計(jì)； 掌握token令牌設(shè)計(jì)； 掌握登錄攔截； 掌握項(xiàng)目部署

4.前端框架

掌握Vue基礎(chǔ)語(yǔ)法和指令； 掌握Vue計(jì)算屬性和監(jiān)聽的使用方法； 掌握Vue組件的定義和基本使用

掌握Vue組件通信的方法； 掌握Vue路由的使用； 掌握Vue路由守衛(wèi)的使用； 掌握Vue網(wǎng)絡(luò)請(qǐng)求Axios的使用； 熟悉Vuex狀態(tài)管理； 熟悉UI庫(kù)的使用

掌握Vue相關(guān)知識(shí)的綜合使用； 熟悉Vue項(xiàng)目的開發(fā)、部署流程； 熟悉Git版本控制軟件的使用； 熟悉數(shù)據(jù)可視化工具的使用" 掌握TypeScript基本類型的使用； 能熟練在Vue-cli3.0中使用TypeScript

掌握React的JSX語(yǔ)法使用； 掌握React事件綁定的方法； 掌握React組件的定義和通信； 掌握React路由及相關(guān)路由組件的使用方法； 掌握React網(wǎng)絡(luò)請(qǐng)求的使用方法； 熟悉React狀態(tài)管理Flux、Redux的原理和流程； 熟悉React項(xiàng)目?jī)?yōu)化、部署流程

5.小程序+數(shù)據(jù)可視化

掌握Vue基礎(chǔ)語(yǔ)法和指令； 掌握Vue計(jì)算屬性和監(jiān)聽的使用方法； 掌握Vue組件的定義和基本使用

掌握Vue組件通信的方法； 掌握Vue路由的使用； 掌握Vue路由守衛(wèi)的使用； 掌握Vue網(wǎng)絡(luò)請(qǐng)求Axios的使用； 熟悉Vuex狀態(tài)管理； 熟悉UI庫(kù)的使用

掌握Vue相關(guān)知識(shí)的綜合使用； 熟悉Vue項(xiàng)目的開發(fā)、部署流程； 熟悉Git版本控制軟件的使用； 熟悉數(shù)據(jù)可視化工具的使用

掌握TypeScript基本類型的使用； 能熟練在Vue-cli3.0中使用TypeScript

掌握React的JSX語(yǔ)法使用； 掌握React事件綁定的方法； 掌握React組件的定義和通信； 掌握React路由及相關(guān)路由組件的使用方法； 掌握React網(wǎng)絡(luò)請(qǐng)求的使用方法； 熟悉React狀態(tài)管理Flux、Redux的原理和流程； 熟悉React項(xiàng)目?jī)?yōu)化、部署流程

關(guān)注優(yōu)就業(yè)，學(xué)習(xí)更多IT知識(shí)。

css派生選擇器有幾種？

基本選擇器

1.標(biāo)簽選擇器：直接用元素的標(biāo)簽來(lái)進(jìn)行選擇

span { // 直接選擇span標(biāo)簽

size:16px;

}

1

2

3

1

2

3

2.ID選擇器：通過設(shè)置id名字，進(jìn)行精確的選擇，用#來(lái)定義

# div1 { //通過id名字來(lái)進(jìn)行選擇

color:red;

}

<div id="div1">1</div>

1

2

3

4

1

2

3

4

3.類選擇器:通過類名來(lái)進(jìn)行選擇，選擇范圍比id選擇器大，用’.'來(lái)定義

.div1 { //所有類名為div1的都被選擇了

color:red;

}

<div id="div1">1</div>

<div id="div1">1</div>

<div id="div1">1</div>

1

2

3

4

5

6

1

2

3

4

5

6

4.通配符選擇器：范圍更大，作用于所有標(biāo)簽，用*來(lái)定義

不建議使用，對(duì)頁(yè)面加載負(fù)擔(dān)大

高級(jí)選擇器

1.后代選擇器：定義用空格隔開

div span { //選擇的是div標(biāo)簽下的span標(biāo)簽，當(dāng)然后代顧名思義可以不止隔一代，可以隔多代進(jìn)行選擇

color：red；

}

<div><span>1</span></div>

1

2

3

4

1

2

3

4

2.交集選擇器：與后代選擇器定義的不同是，沒有空格隔開，兩個(gè)元素緊挨著

span#a1 { //選擇的是兩個(gè)條件1.既是span標(biāo)簽的 2.id名是a1的元素，兩個(gè)條件缺一不可

color：red；

}

<span id=“a1”>1</span>

<span >1</span>

1

2

3

4

5

1

2

3

4

5

3.并集選擇器：定義用逗號(hào)隔開

span，#a1 { //選擇的是1.是span標(biāo)簽的 2.id名是a1的元素，兩個(gè)條件滿足一個(gè)即可

color：red；

}

<span id=“a1”>1</span>

<span >1</span>

1

2

3

4

5

1

2

3

4

5

4.偽類選擇器：

1.靜態(tài)偽類：點(diǎn)擊連接之前（link），點(diǎn)擊連接之后(visited)這樣的

2.動(dòng)態(tài)偽類：鼠標(biāo)移入（hover），點(diǎn)擊之后（focus）

使用scss或less代替css值得嗎？

Sass/Scss&Less是什么？Sass (Syntactically Awesome Stylesheets)是一種動(dòng)態(tài)樣式語(yǔ)言，語(yǔ)法跟css一樣(但多了些功能)，比css好寫，而且更容易閱讀。Sass語(yǔ)法類似與Haml，屬于縮排語(yǔ)法（makeup），用意就是為了快速寫Html和Css。Less一種動(dòng)態(tài)樣式語(yǔ)言. 將CSS賦予了動(dòng)態(tài)語(yǔ)言的特性，如變量，繼承，運(yùn)算， 函數(shù). LESS 既可以在客戶端上運(yùn)行 (支持IE 6+, Webkit, Firefox)，也可一在服務(wù)端運(yùn)行 (借助 Node.js)。less英文站需要翻墻，也可以訪問中文站。

優(yōu)點(diǎn)：1、提供了許多便利的寫法，讓CSS 的處理實(shí)現(xiàn)了可編程處理。2、擴(kuò)展了 CSS3，增加了規(guī)則、變量、混合、選擇器、繼承等等特性，可以生成風(fēng)格良好的 CSS 樣式表文件，易于組織和維護(hù)。3、能有效減少代碼冗余的問題另外：建議使用 scss 文件，這種和我們平時(shí)寫的 css 文件格式差不多，使用大括號(hào)和分號(hào)。以避免 sass 后綴名的嚴(yán)格格式要求而報(bào)錯(cuò)。

個(gè)人覺得scss可以使操作更簡(jiǎn)便，表達(dá)更簡(jiǎn)便，還是值得試一試的。