1. 樣式有幾種引入方式? link 和 @import有什么區別？
- 外部樣式表：指在html文件的head標簽中，使用link引用另一個css文件中定義的樣式。當樣式需要被應用到多個頁面的時候，外部樣式表將是理想的選擇。
<html>
<title>renwu5</title>
<head>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body></body>
</html>
- 內部樣式表：指在html文件的head標簽內聲明樣式。當單個文件需要特別樣式時，就可以使用內部樣式表。你可以在 head 部分通過 <style> 標簽定義內部樣式表。
<html>
<title>renwu5</title>
<head>
<style>
p {
color:red;
font-size:10px;
}
</style>
</head>
<body>
<p>css樣式</p>
</body>
</html>
- 內聯樣式：當特殊的樣式需要應用到個別元素時，就可以使用內聯樣式。 使用內聯樣式的方法是在相關的標簽中使用樣式屬性。樣式屬性可以包含任何 CSS 屬性。
<html>
<title>renwu5</title>
<head>
</head>
<body>
<p style="color: #fff">css樣式</p>
</body>
</html>
- @import導入式：
<style type="text.css">
@import url("style.css");
</style>
** link 和 @import有什么區別？**
- 根本的區別。link屬于XHTML標簽，而@import完全是CSS提供的一種方式。link標簽除了可以加載CSS外，還可以做很多其它的事情，比如定義RSS，定義rel連接屬性等，@import就只能加載CSS了。
- 加載順序的區別。當一個頁面被加載的時候（就是被瀏覽者瀏覽的時候），link引用的CSS會同時被加載，而@import引用的CSS 會等到頁面全部被下載完再被加載。所以有時候瀏覽@import加載CSS的頁面時開始會沒有樣式（就是閃爍），網速慢的時候還挺明顯。
- 兼容性的區別。由于@import是CSS2.1提出的所以老的瀏覽器不支持，@import只有在IE5以上的才能識別，而link標簽無此問題。
- 使用dom控制樣式時的差別。當使用javascript控制dom去改變樣式的時候，只能使用link標簽，因為@import不是dom可以控制的。
2. 文件路徑../main.css 、./main.css、main.css有什么區別?
- ../main.css：指上一級目錄下的文件
- ./main.css：指當前目錄下的文件，“./”也可以省略
- main.cs?s：指當前目錄下的文件
3. console.log是做什么用的?
主要是方便調式javascript用的，因為它可以看到頁面中輸出的內容。相比alert而言：它能看到結構話的東西，如果是alert，彈出一個對象就是[object object],但是console能看到對象的內容。還有就是console不會打斷你頁面的操作，如果用alert彈出來內容，那么頁面就死了，但是console輸出內容后你頁面還可以正常操作。
4. text-align有幾個值，分別有什么作用？
text-align 屬性規定元素中的文本的水平對齊方式。該屬性通過指定行框與哪個點對齊，從而設置塊級元素內文本的水平對齊方式。它的值有：left、center、right、justify、inherit。
left:實現文本居左顯示
center:實現文本居中顯示
right:實現文本居右顯示
justify:實現文本兩端對齊
inherit:規定應該從父元素繼承 text-align 屬性的值
5. px、em、rem分別是什么？有什么區別？如何使用？
px，是一種像素尺寸，在html可以直接用來指定字體的大小，假設一個字體的高度為16像素，這說明字母的最低部分和最高部分之間有16像素。
em,類似于百分數，是一個相對度量單位，使用em時，要指定一個比例因子，如：font-size:1.2em;
這表示該元素的字體大小是它父元素的字體大小的1.2倍。這個單位過于靈活，只要有一個父單位被改變，此單位就會隨之改變，所以一般來說用的少一些。
rem，是css3中增加的相對度量單位，是相對于根元素(即html元素)計算值的倍數。這個單位可謂集相對大小和絕對大小的優點于一身，通過它既可以做到只修改根元素就成比例地調整所有字體大小，又可以避免字體大小逐層復合的連鎖反應。
6. 對chrome 審查元素的功能做個簡單的截圖介紹
7. 如下代碼，設置 p為幾 rem，讓h1和p的字體大小相等?
瀏覽器的默認字體大小為16px,那么HTML字體大小為：62.5%×16=10px，10×？=60px,所以當p為6rem時,p 和h1字體大小相等。
本教程版權歸本人和饑人谷所有，轉載須說明來源
