1.line-height有什么作用?
答:这个代表行高,是指一行文字顶部和底部之间的高度。line-height
用于撑开div的高度的高度,div的高度与里面文字的大小无关。他还具有垂直居中性,把line-height
设置为需要的box的大小可以实现单行文字的垂直居中。深入:
在显示文章的box里,px的表示方法首先是要被淘汰的。因为文章里面的文字是有大有小的,使用px定值,由于继承性,无法实现根据文字大小自动调整间距,会出现大号文字重叠的现象。normal也是不行的,一般文章显示最好是650像素的宽度,1.5倍的行距较好。一般浏览器的normal值在1~1.2之间,使用normal必然文字间距过小,阅读吃力。百分值也有继承性,但是有个很搓的办法可以实现文字间距自动适应于文字的大小,那就是使用“”通配符。为什么说这个方法搓呢,使用“”通配符大大增加了css的渲染,效率低,而且有更好的方法,就是使用数值。150%虽然和1.5在值上是一样的,但是它们也是有差别的,差别在于继承性,使用百分比会计算line-height的值,然后以px像素为单位继承下去,而1.5则是先继承1.5这个值,遍历到了该标签再计算去line-height的像素值。所以同样的效果只需要.article_box{line-height:1.5;}
就可以实现了。
2.如何去查CSS属性的兼容性?比如inline-block哪些浏览器支持?
答:在网站can I use上查看。
如图所示:
3.a 标签的href, title, target 是什么? title 和 alt有什么区别?如何新窗口打开链接?
答:a标签的href用来规定链接指向的页面的 URL,title用来工具提示,当鼠标在超链接上悬停时,会提示title中的内容,target用来规定在何处打开链接文档。在新窗口打开链接应使用_blank,例如<a target="_blank" href="#"><a>
。
alt 是图片加载失败时,显示在网页上的替代文字;title 是鼠标放上面时显示的文字。这些都是表面上的区别,alt是img必要的属性,而title不是。
4.display: none , visibility: hidden, opacity:0 有什么作用?有什么区别?
答:<display:none>
使元素彻底消失仿佛从未存在一样,其他元素会重新排列网页会重新渲染。
<visibility:hidden>
使元素消失但是会保留元素所占的空间,不影响其他元素,且不会触发该元素绑定的JS事件。
<opacity:0>
显示效果跟<visibility:hidden>
一样,但是可以触发绑定的JS事件。
5.如何去除 a 链接的默认样式?直接在 a 链接父容器添加颜色,能否继承到当前 a 链接上?
答:在对相应链接应用样式text-decoration:none。
a链接不会继承父容器颜色,需要对a链接单独设置样式。