1.line-height有什么作用?
line-height是行高的意思蒿涎。具體指兩行文字基線之間的距離。
line-height有幾種表示方法：normal鹃彻、px/em侈询、百分值、數(shù)值和inherit（繼承）晚碾。
可以看一個例子抓半，體會這幾種表示方法的不同
代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body {
font-size: 16px;
line-height: XXX; <!--這里設(shè)置不同的line-height-->
}
h1 {
font-size: 32px;
}
p {
font-size: 16px;
}
#footer {
font-size: 12px;
}
</style>
</head>
<body>
<h1>關(guān)于line-height<br/>關(guān)于line-height</h1>
<p>行高有5種不同的表示方法。<br/>行高有5種不同的表示方法格嘁。</p>
<div id="footer">
這五種方法有什么不同呢笛求？<br/>這五種方法有什么不同呢？
</div>
</body>
</html>
line-height: normal;相當(dāng)于line-height:1.2,效果如下：
line-height: 20px;,效果如下：
line-height: 150%;讥蔽，效果如下：
line-height: 1.5;涣易，效果如下：
用
line-height: inherit時就繼承了上級元素的屬性。在
h1 {
font-size: 32px;
}
中加入line-height: inherit;,發(fā)現(xiàn)和上面幾種不加line-height: inherit;的情況一樣冶伞，因為本身它們都有繼承性新症。
可以看出來，line-height: 20px;和line-height: 150%;都繼承了<body>的行高响禽，造成不同大小的文本擁擠或者稀疏徒爹。line-height: normal;不如line-height: 1.5;是隨著相應(yīng)的字體大小變化，看上去效果更好芋类。相比較隆嗅，normal不可以隨意改變數(shù)值，效果看上去也比較擁擠侯繁，所以胖喳，數(shù)值這個表示方法最好。
一般設(shè)置字體贮竟，可以寫成
font: 12px/1.5 "Microsoft YaHei",sans-serif,其中/后面的1.5表示行高丽焊。
line-height還有一個重要用途较剃，可以用于讓單行文字文字垂直居中。設(shè)置line-height高度等于外部標(biāo)簽盒子高度技健，可以使文字垂直居中写穴。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
p {
height: 100px;
line-height: 100px;
border: 1px solid red;
}
</style>
</head>
<body>
<p>垂直居中</p>
</body>
</html>
效果：
2.如何去查CSS屬性的兼容性？比如inline-block哪些瀏覽器支持雌贱？
可以使用can i use網(wǎng)站查看啊送。例如inline-block，查詢到的結(jié)果如下圖所示：
主要是看IE瀏覽器的支持性欣孤，發(fā)現(xiàn)從IE8以后開始支持inline-block馋没。
3.a 標(biāo)簽的href, title, target 是什么？ title 和 alt有什么區(qū)別降传？如何新窗口打開鏈接?
<a>標(biāo)簽定義超鏈接披泪，用于從一個頁面鏈接到另一個頁面。
href屬性是<a>標(biāo)簽最重要的屬性搬瑰，定義鏈接指向的頁面。
title屬性顯示鏈接的額外信息控硼，當(dāng)鼠標(biāo)懸停在鏈接上時泽论，會顯示title屬性的值。
比如鏈接
<a title="超鏈接">這是超鏈接</a>
當(dāng)鼠標(biāo)懸停在超鏈接上時卡乾，如下圖所示：
target屬性規(guī)定在何處打開鏈接文檔翼悴。主要有以下屬性值:
_blank 在新窗口打開被鏈接文檔。
_self 默認(rèn)幔妨，在相同的框架打開被鏈接文檔鹦赎。
_parent 在父框架集中打開被鏈接文檔。
_top 在整個窗口中打開被鏈接文檔误堡。
_framename 在指定框架中打開被鏈接文檔古话。
其中，_blank最常用锁施，用于在新窗口打開鏈接陪踩。
title屬性為設(shè)置該屬性的元素提供建議性的信息。title屬性可以用在除了base悉抵，basefont肩狂，head，html姥饰，meta傻谁，param，script和title之外的所有標(biāo)簽中列粪。title屬性可以為鏈接添加描述性信息审磁，給瀏覽者關(guān)于鏈接的提示谈飒。還可以為圖像提供額外的說明信息，比如日期或者其他非本質(zhì)的信息力图。
alt屬性只可以用在img步绸、textarea、input標(biāo)簽中吃媒。用于在圖片無法顯示時瓤介，給用戶提供關(guān)于圖像的文字說明。和title不同赘那，alt屬性是替代圖片刑桑，而不是提供文字說明的∧贾郏可以優(yōu)化搜索引擎祠斧。在img、textarea拱礁、input標(biāo)簽中title琢锋、alt可以同時存在。
當(dāng)遇到
<a>標(biāo)簽包圍<img>標(biāo)簽時呢灶，顯示的是<img>標(biāo)簽的title屬性吴超。<a href="b.html" title="你好"><img src="" alt="鏈接圖片" title= "圖片"></a>效果圖：
要在新窗口打開連接，可以把title屬性設(shè)置為_blank,
<a href="http:www.baidu.com" title="超鏈接" target="_blank">這是超鏈接</a>
4.display: none , visibility: hidden, opacity:0有什么作用鸯乃？有什么區(qū)別鲸阻？
display: none , visibility: hidden, opacity:0都可以隱藏頁面上的元素。
display:none是把元素徹底隱藏缨睡，在html上不占據(jù)空間鸟悴，如果該元素綁定了onclick事件，點擊也沒有響應(yīng)奖年。而且應(yīng)用了display:none的節(jié)點的子節(jié)點也同樣被隱藏细诸，也沒有辦法顯示出來。
visibility: hidden隱藏元素在html上占據(jù)空間陋守，如果該元素綁定了onclick事件揍堰，點擊沒有響應(yīng)。而且嗅义，子節(jié)點可以通過visibility：vsible顯示出來屏歹。
opacity:0是設(shè)置透明度為零，只是肉眼看不到節(jié)點了而已之碗，節(jié)點既占據(jù)空間蝙眶，當(dāng)該元素綁定了onclick事件時，點擊也有響應(yīng)。
5.如何去除 a 鏈接的默認(rèn)樣式幽纷？直接在 a 鏈接父容器添加顏色式塌，能否繼承到當(dāng)前 a 鏈接上？
a鏈接默認(rèn)有下劃線友浸，默認(rèn)點擊鏈接后鏈接字體顏色改變峰尝。
去除a鏈接的默認(rèn)樣式，可以在css中設(shè)置a的樣式：
a {
color: red; /* 設(shè)置鏈接顏色一直是紅色*/
text-decoration: none; /*設(shè)置鏈接沒有下劃線*/
}
直接在a鏈接父容器添加顏色收恢，不能繼承到當(dāng)前a鏈接武学。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{
color: #0f0;
font-size: 20px;
font-family: "黑體";
}
</style>
</head>
<body>
<div>
<p>百度一下</p>
<a href="http:www.baidu.com" title="超鏈接" target="_blank">這是超鏈接</a>
</div>
</body>
</html>
a鏈接的顏色不受影響
** 版權(quán)歸本人和饑人谷所有，轉(zhuǎn)載請注明出處伦意。 **
