1.line-height有什么作用?
答:這個(gè)代表行高挫酿,是指一行文字頂部和底部之間的高度余赢。line-height
用于撐開(kāi)div的高度的高度芯义,div的高度與里面文字的大小無(wú)關(guān)。他還具有垂直居中性妻柒,把line-height
設(shè)置為需要的box的大小可以實(shí)現(xiàn)單行文字的垂直居中扛拨。深入:
在顯示文章的box里,px的表示方法首先是要被淘汰的举塔。因?yàn)槲恼吕锩娴奈淖质怯写笥行〉陌缶褂胮x定值求泰,由于繼承性,無(wú)法實(shí)現(xiàn)根據(jù)文字大小自動(dòng)調(diào)整間距计盒,會(huì)出現(xiàn)大號(hào)文字重疊的現(xiàn)象渴频。normal也是不行的,一般文章顯示最好是650像素的寬度北启,1.5倍的行距較好卜朗。一般瀏覽器的normal值在1~1.2之間,使用normal必然文字間距過(guò)小咕村,閱讀吃力场钉。百分值也有繼承性,但是有個(gè)很搓的辦法可以實(shí)現(xiàn)文字間距自動(dòng)適應(yīng)于文字的大小懈涛,那就是使用“”通配符逛万。為什么說(shuō)這個(gè)方法搓呢,使用“”通配符大大增加了css的渲染肩钠,效率低泣港,而且有更好的方法,就是使用數(shù)值价匠。150%雖然和1.5在值上是一樣的当纱,但是它們也是有差別的,差別在于繼承性踩窖,使用百分比會(huì)計(jì)算line-height的值坡氯,然后以px像素為單位繼承下去,而1.5則是先繼承1.5這個(gè)值洋腮,遍歷到了該標(biāo)簽再計(jì)算去line-height的像素值箫柳。所以同樣的效果只需要.article_box{line-height:1.5;}
就可以實(shí)現(xiàn)了。
2.如何去查CSS屬性的兼容性啥供?比如inline-block哪些瀏覽器支持悯恍?
答:在網(wǎng)站can I use上查看。
如圖所示:
3.a 標(biāo)簽的href, title, target 是什么伙狐? title 和 alt有什么區(qū)別涮毫?如何新窗口打開(kāi)鏈接?
答:a標(biāo)簽的href用來(lái)規(guī)定鏈接指向的頁(yè)面的 URL,title用來(lái)工具提示贷屎,當(dāng)鼠標(biāo)在超鏈接上懸停時(shí)罢防,會(huì)提示title中的內(nèi)容,target用來(lái)規(guī)定在何處打開(kāi)鏈接文檔。在新窗口打開(kāi)鏈接應(yīng)使用_blank唉侄,例如<a target="_blank" href="#"><a>
咒吐。
alt 是圖片加載失敗時(shí),顯示在網(wǎng)頁(yè)上的替代文字;title 是鼠標(biāo)放上面時(shí)顯示的文字恬叹。這些都是表面上的區(qū)別候生,alt是img必要的屬性,而title不是妄呕。
4.display: none , visibility: hidden, opacity:0 有什么作用陶舞?有什么區(qū)別?
答:<display:none>
使元素徹底消失仿佛從未存在一樣绪励,其他元素會(huì)重新排列網(wǎng)頁(yè)會(huì)重新渲染。
<visibility:hidden>
使元素消失但是會(huì)保留元素所占的空間唠粥,不影響其他元素疏魏,且不會(huì)觸發(fā)該元素綁定的JS事件。
<opacity:0>
顯示效果跟<visibility:hidden>
一樣晤愧,但是可以觸發(fā)綁定的JS事件大莫。
5.如何去除 a 鏈接的默認(rèn)樣式?直接在 a 鏈接父容器添加顏色官份,能否繼承到當(dāng)前 a 鏈接上只厘?
答:在對(duì)相應(yīng)鏈接應(yīng)用樣式text-decoration:none。
a鏈接不會(huì)繼承父容器顏色舅巷,需要對(duì)a鏈接單獨(dú)設(shè)置樣式羔味。