一护侮、css是什么藏研？
CSS全稱是Cascading Style Sheets，簡寫為CSS概行，稱作：層疊樣式表蠢挡，又稱串樣式列表、級聯(lián)樣式表凳忙、串接樣式表业踏，一種用來為結(jié)構(gòu)化文檔（如 HTML文檔或 XML 應(yīng)用）添加樣式（字體、間距和顏色等）的計算機(jī)語言涧卵，由 W3C 定義和維護(hù)勤家。
網(wǎng)頁的讀者和作者都可以使用CSS來決定文件的顏色、字體柳恐、排版等顯示特性伐脖。CSS 最主要的目的是將文件的內(nèi)容與顯示分隔開來热幔。這有許多好處：
1、文件的可讀性加強(qiáng)讼庇。
2绎巨、文件的結(jié)構(gòu)更加靈活。
3蠕啄、作者和讀者可以自己決定文件的顯示场勤。
4、文件的結(jié)構(gòu)簡化了歼跟。
參考資料1
二和媳、CSS有幾種引入方式？link和@import有什么區(qū)別哈街？
有 4 種方式可以在 HTML 中引入 CSS留瞳。其中有 2 種方式是在 HTML 文件中直接添加 CSS 代碼，另外兩種是引入外部 CSS 文件骚秦。下面我們就來看看這些方式和它們的優(yōu)缺點她倘。
1、內(nèi)聯(lián)樣式
將style屬性直接加在個別的元件標(biāo)簽里骤竹，<元件(標(biāo)簽) style="性質(zhì)(屬性)1: 設(shè)定值1; 性質(zhì)(屬性)2: 設(shè)定值2; ...}帝牡。
這通常是個很復(fù)雜的書寫方式，它只能改變當(dāng)前標(biāo)簽的樣式蒙揣，如果想要多個 <div> 擁有相同的樣式靶溜，你不得不重復(fù)地為每個 <div> 添加相同的樣式，如果想要修改一種樣式懒震，又不得不修改所有的 style 中的代碼罩息。很顯然，內(nèi)聯(lián)方式引入 CSS 代碼會導(dǎo)致 HTML 代碼變得冗長个扰，且使得網(wǎng)頁難以維護(hù)瓷炮。
2、內(nèi)部樣式
內(nèi)部樣式也叫內(nèi)嵌式递宅，是將樣式代碼寫在<style></style>標(biāo)簽中娘香，通常將style標(biāo)簽放到HTML文件<head></head>標(biāo)簽里。
嵌入方式的 CSS 只對當(dāng)前的網(wǎng)頁有效办龄。因為 CSS 代碼是在 HTML 文件中烘绽，所以會使得代碼比較集中，當(dāng)我們寫模板網(wǎng)頁時這通常比較有利俐填。因為查看模板代碼的人可以一目了然地查看 HTML 結(jié)構(gòu)和 CSS 樣式安接。因為嵌入的 CSS 只對當(dāng)前頁面有效，所以當(dāng)多個頁面需要引入相同的 CSS 代碼時英融，這樣寫會導(dǎo)致代碼冗余盏檐，也不利于維護(hù)歇式。
3、外部引用 link 標(biāo)簽引用CSS
將樣式規(guī)則寫在.css的樣式文件中胡野，再以<link>標(biāo)簽引入材失。這樣引入該css樣式表文件以后，就可以直接套用該樣式檔案中所制定的樣式了给涕。 通常是將link標(biāo)簽寫在網(wǎng)頁的<head></head>部份之中豺憔。
這種方法的優(yōu)點：可以把要套用相同樣式規(guī)則的數(shù)篇文件都指定到同一個樣式文件中额获，可以進(jìn)行統(tǒng)一的修改够庙，也便于整站的設(shè)置有統(tǒng)一的風(fēng)格。這是最常見的也是最推薦的引入 CSS 的方式抄邀。使用這種方式耘眨，所有的 CSS 代碼只存在于單獨的 CSS 文件中，所以具有良好的可維護(hù)性境肾。并且所有的 CSS 代碼只存在于 CSS 文件中剔难，CSS 文件會在第一次加載時引入，以后切換頁面時只需加載 HTML 文件即可奥喻。
4偶宫、外部引用 @import 引用CSS
跟link方法很像，但必須放在<STYLE>...</STYLE> 中环鲤。
要注重的是纯趋，@improt行末的分號是必須的！千萬不能漏寫冷离！
這種方法的優(yōu)點：可以靈活的引入css文件對xhtml元素進(jìn)行控制吵冒。有時候也用來編寫某些css hack。
這種方法的缺點：在個別文件或元素的靈活度不足西剥。
link和@import引用區(qū)別：
差別1：link 屬于 HTML痹栖，通過 <link>標(biāo)簽中的 href 屬性來引入外部文件，而 @import 屬于 CSS瞭空，所以導(dǎo)入語句應(yīng)寫在 CSS 中揪阿，要注意的是導(dǎo)入語句應(yīng)寫在樣式表的開頭，否則無法正確導(dǎo)入外部文件咆畏；link標(biāo)簽除了可以加載CSS外南捂，還可以做很多其它的事情，比如定義RSS鳖眼，定義rel連接屬性等黑毅，@import就只能加載CSS了。
差別2：加載順序的差別钦讳。當(dāng)一個頁面被加載的時候（就是被瀏覽者瀏覽的時候）矿瘦，link引用的CSS會同時被加載枕面，而@import引用的CSS會等到頁面全部被下載完再被加載。所以有時候瀏覽@import加載CSS的頁面時開始會沒有樣式（就是閃爍）缚去，網(wǎng)速慢 的時候還挺明顯潮秘。
差別3：兼容性的差別。由于@import是CSS2.1提出的所以老的瀏覽器不支持易结，@import只有在IE5以上的才能識別枕荞，而link標(biāo)簽無此問題。
差別4：使用dom控制樣式時的差別搞动。當(dāng)使用javascript控制dom去改變樣式的時候躏精，只能使用link標(biāo)簽，因為@import不是dom可以控制的鹦肿。
差別5：@import可以在css中再次引入其他樣式表矗烛，比如可以創(chuàng)建一個主樣式表，在主樣式表中再引入其他的樣式表箩溃。這樣更利于修改和擴(kuò)展瞭吃。但這樣做有一個缺點，會對網(wǎng)站服務(wù)器產(chǎn)生過多的HTTP請求涣旨，以前是一個文件歪架，而現(xiàn)在卻是兩個或更多文件 了，服務(wù)器的壓力增大霹陡，瀏覽量大的網(wǎng)站還是謹(jǐn)慎使用和蚪。參考資料2參考資料3
三、以下這幾種文件路徑分別用在什么地方穆律，代表什么意思?
1惠呼、css/a.css
可以用在本地路徑也可以用在網(wǎng)絡(luò)路徑。表示相對路徑峦耘，用在尋找當(dāng)前目錄下的css目錄下的a.css文件 剔蹋。
2、./css/a.css
用在本地路徑辅髓，表示相對路徑泣崩，用于尋找當(dāng)前目錄下的css目錄下的a.css文件。
3洛口、b.css
可以用在本地路徑矫付，也可以用在網(wǎng)絡(luò)路徑。表示相對路徑第焰，用于尋找當(dāng)前目錄下的b.css文件买优。
4、../imgs/a.png
用在本地路徑也可以用在網(wǎng)絡(luò)路徑，表示相對路徑杀赢，用于尋找上級目錄下的imgs目錄下的a.png文件烘跺。
5、/Users/hunger/project/css/a.css
用在本地路徑脂崔，一般不用于網(wǎng)絡(luò)路徑滤淳。表示絕對路徑，用于尋找本地根目錄下的Users/hunger/project/css/a.css砌左。
6脖咐、/static/css/a.css
用在網(wǎng)絡(luò)路徑，表示在static目錄下的css目錄下的a.css文件路徑汇歹。
7屁擅、http://cdn.jirengu.com/kejian1/8-1.png
網(wǎng)絡(luò)路徑，表示域名下的kejian1文件下的8-1.png文件秤朗。
四煤蹭、在js.jirengu.com上展示一個圖片笔喉，需要怎么操作?
1取视、我們在編寫html時，使用img標(biāo)簽的src屬性時常挚，它的值就是你要展示圖片的路徑作谭，如果這個圖片和html文件在同一個目錄下，直接就是圖片名奄毡；如果不在同一個目錄下折欠，就使用相對路徑找到圖片位置。一般不使用絕對路徑添加圖片吼过。
2锐秦、當(dāng)圖片不在本地而是在網(wǎng)絡(luò)上，我們可以直接復(fù)制圖片的網(wǎng)址到src中盗忱。
五酱床、列出5條以上html和 css 的書寫規(guī)范（非強(qiáng)制）
1、語法不區(qū)分大小寫趟佃，但潛規(guī)則是統(tǒng)一使用小寫扇谣。
2、不使用內(nèi)聯(lián)的style屬性定義樣式闲昭。
3罐寨、id和class使用有意義的單詞，分隔符建議使用 -序矩，不建議使用下橫線_鸯绿。
4、屬性值是0，就省略單位瓶蝴。
5幔烛、塊內(nèi)容要縮進(jìn)，為了使整體看起來規(guī)范整齊囊蓝。
6饿悬、屬性名冒號后面加一個空格，也是為了好看聚霜。
六狡恬、chrome開發(fā)工具介紹
在瀏覽器界面，直接右擊蝎宇、檢查或者快捷鍵F12弟劲，即可打開。
Google Chrome一共提供了8大組工具：
1姥芥、Elements: 允許我們從瀏覽器的角度看頁面兔乞，也就是說我們可以看到chrome渲染頁面所需要的的HTML、CSS和DOM(Document Object Model)對象凉唐。此外庸追，還可以編輯這些內(nèi)容更改頁面顯示效果；
2台囱、Network: 可以看到頁面向服務(wù)器請求了哪些資源淡溯、資源的大小以及加載資源花費的時間，當(dāng)然也能看到哪些資源不能成功加載簿训。此外咱娶，還可以查看HTTP的請求頭，返回內(nèi)容等强品；
3膘侮、Sources: 主要用來調(diào)試js；
4的榛、Timeline: 提供了加載頁面時花費時間的完整分析琼了，所有事件，從下載資源到處理Javascript困曙，計算CSS樣式等花費的時間都展示在Timeline中表伦；
5、Profiles: 分析web應(yīng)用或者頁面的執(zhí)行時間以及內(nèi)存使用情況慷丽；
6蹦哼、Resources: 對本地緩存（IndexedDB、Web SQL要糊、Cookie纲熏、應(yīng)用程序緩存、Web Storage）中的數(shù)據(jù)進(jìn)行確認(rèn)及編輯；
7局劲、Audits: 分析頁面加載的過程勺拣，進(jìn)而提供減少頁面加載時間、提升響應(yīng)速度的方案鱼填；
8药有、Console: 顯示各種警告與錯誤信息，并且提供了shell用來和文檔苹丸、開發(fā)者工具交互愤惰。
每個工具的界面，又有一些其它工具赘理，祥知可以參考chrome開發(fā)工具介紹
