1、css選擇器的嵌套，有哪些精致的CSS？

謝謝邀請

Bootstrap

Bootstrap，我最早接觸的就是他，簡潔、直觀、強悍的前端開發框架，讓web開發更迅速、簡單。其自帶的js以及css可以完成絕大多數常用的網頁特效與響應功能。

Blueprint 是一款成熟的 CSS 框架，它將布局(layout)、排版(typography)、組件 (widget)、重置 (reset)、打印 (print) 等分放到不同的 CSS 文件中。在網頁設計時就減少了引入的代碼，提高了頁面加載效率。

Ant Design

Ant Design 我是學react的時候用的ui庫 切合度高。

ElementUI

ElementUI和Vue配合很得心應手。

沒有萬能框架，只有根據實際情況選擇適合自己的。

2、請問如何改變鼠標選定文本時的顏色？

鼠標選中后，背景變色的方法：如：改變選中后，選中區域的背景顏色為淺藍色。在css中寫入如下代碼：/* webkit, opera, IE9 */::selection { background:lightblue; }/* mozilla firefox */::-moz-selection { background:lightblue; }說明：

1、-moz-屬性前綴是個火狐瀏覽器用的，而基本的::selection選擇器是給谷歌瀏覽器用的。

2、background后面可以直接使用顏色值。如：::selection { background:#ffff00; }另外：跟其它CSS選擇器的用法一樣，也可以嵌套使用，在不同的地方顯示不同的顏色。如下：/* webkit, opera, IE9 */div.highlightBlue::selection { background:lightblue; }/* mozilla firefox */div.highlightBlue::-moz-selection { background:lightblue; }

/* webkit, opera, IE9 */div.highlightpink::selection { background:pink; }/* mozilla firefox */div.highlightPink::-moz-selection { background:pink; }

3、css3的transition是直接寫在選擇器上？

寫在哪里是要分情況的，是要看你想要實現什么效果。

1）如果寫在選擇器，如果是寫的rotate等事件，則直接執行事件，如果寫的是transtion:all ease 0.5s，那么他在你鼠標移入以及鼠標移出的時候都會發揮作用。

2）寫在hover上，那么他只會在鼠標移入的時候才執行你自己定義的transtion動作，移出沒有效果；

4、css的優先級怎么判斷？

CSS選擇器中比較常見的有標簽選擇器、ID選擇器、類選擇器以及子選擇器。而事實上，CSS選擇器如果細分下來，竟然多達40多種。那他們的優先級該怎么比較呢，下面就來看看吧。

● 不同級別

1. 在屬性后面使用 !important 會覆蓋頁面內任何位置定義的元素樣式。

2. 作為style屬性寫在元素內的樣式

3. id選擇器

4. 類選擇器

5. 元素選擇器

6. 通配符選擇器

7. 瀏覽器自定義或繼承

總結排序：!important > 行內樣式 > ID選擇器 > 類選擇器 > 元素 > 通配符 > 繼承 > 瀏覽器默認屬性

● 同一級別

(1) 同一級別中后寫的會覆蓋先寫的樣式

(2) 同一級別css引入方式不同，優先級不同

總結排序：內聯(行內)樣式 > 內部樣式表 > 外部樣式表 > 導入樣式(@import)。

對于選擇器優先級，還可以通過計算權重值來比較