1.樣式有幾種引入方式? link和 @import有什么區(qū)別?
- 1.內(nèi)聯(lián)式就是把css代碼直接寫(xiě)在現(xiàn)有的HTML標(biāo)簽中
<p style="color:red">這里文字是紅色吓揪。</p> - 2.嵌入式css樣式，就是可以把css樣式代碼寫(xiě)在<style type="text/css"></style>標(biāo)簽之
<styletype="text/css">p{color:red;}</style> - 3.外部式css樣式(也可稱(chēng)為外聯(lián)式)就是把css代碼寫(xiě)一個(gè)單獨(dú)的外部文件中酒请，這個(gè)css樣式文件以“.css”為擴(kuò)展名，在<head>內(nèi)使用<link>標(biāo)簽將css樣式文件鏈接到HTML文件內(nèi)帽撑。
<link rel="stylesheet" type="text/css" href="css./index.css">
1褒搔、@import會(huì)增加一次roundtrip，延長(zhǎng)頁(yè)面加載時(shí)間恳啥；
2偏灿、使用@import，在IE中可能引起頁(yè)面加載順序改變（比如JS在css之前加載钝的，可能出現(xiàn)一些問(wèn)題）翁垂，導(dǎo)致樣式表需要更長(zhǎng)時(shí)間加載，讓人感覺(jué)頁(yè)面渲染很慢硝桩。
2.文件路徑../main.css沿猜、./main.css、main.css有什么區(qū)別?
../main.css是上級(jí)目錄下main.css文件
./main.css和/main.css同樣是本目錄下main.css文件
3.console.log是做什么用的?
方便用來(lái)調(diào)試javascript碗脊。
4.text-align有幾個(gè)值啼肩，分別有什么作用?
| text-align值 | 對(duì)齊方式 |
|---|---|
| left | 左對(duì)齊 |
| right | 右對(duì)齊 |
| center | 居中對(duì)齊 |
| justify | 兩端對(duì)齊 |
5.px、em衙伶、rem分別是什么祈坠？有什么區(qū)別？如何使用?
- px:像素px是相對(duì)于顯示器屏幕分辨率而言的相對(duì)長(zhǎng)度單位矢劲。
em:相對(duì)于當(dāng)前對(duì)象內(nèi)文本的字體尺寸的相對(duì)長(zhǎng)度單位赦拘。如當(dāng)前對(duì)行內(nèi)文本的字體尺寸未被人為設(shè)置，則相對(duì)于瀏覽器的默認(rèn)字體尺寸卧须。
rem:相對(duì)于HTML根元素的相對(duì)長(zhǎng)度單位另绩。通過(guò)它既可以做到只修改根元素就成比例地調(diào)整所有字體大小儒陨，又可以避免字體大小逐層復(fù)合的連鎖反應(yīng)。對(duì)于不支持它的瀏覽器笋籽，要多寫(xiě)一個(gè)絕對(duì)單位的聲明蹦漠。這些瀏覽器會(huì)忽略用rem設(shè)定的字體大小
參考:徹底弄懂css中單位px和em,rem的區(qū)別by Leejersey
6.對(duì)chrome 審查元素的功能做個(gè)簡(jiǎn)單的截圖介紹。
審查元素簡(jiǎn)單介紹
審查元素-Sources
再貼一張firefox的審查元素
參考：饑人谷曹婷婷的作業(yè)/饑人谷鄭哲明 的作業(yè)车海。
7.如下代碼笛园，設(shè)置 p為幾 rem，讓h1和p的字體大小相等?
<h1>饑人谷</h1>
<p>饑人谷</p>
<style>
html{
font-size: 62.5%;
}
p{
font-size: 6rem;
}
h1{
font-size: 60px;
}
</style>```
任意瀏覽器的默認(rèn)字體高都是16px侍芝。所有未經(jīng)調(diào)整的瀏覽器都符合: 1em=16px研铆。那么12px=0.75em,10px=0.625em。為了簡(jiǎn)化font-size的換算州叠，需要在css中的body選擇器中聲明Font-size=62.5%棵红，這就使em值變?yōu)?16px*62.5%=10px, 這樣12px=1.2em, 10px=1em, 也就是說(shuō)只需要將你的原來(lái)的px數(shù)值除以10，然后換上em作為單位就行了咧栗。
本教程版權(quán)歸 饑人谷_Josh和饑人谷所有逆甜，轉(zhuǎn)載須說(shuō)明來(lái)源