问答
一、line-height有什么作用?
- 在CSS,line-height被用来控制行与行之间的垂直距离。line-height 属性会影响行框的布局。在应用到一个块级元素时,它定义了该元素中基线之间的最小距离而不是最大距离。
- 行高还有一个特性,叫做垂直居中性,这一重要的特性可以用来实现文字或图片的垂直居中对齐。
- 行高在文章显示中的应用,不会出现文字重叠的情况。
- 使用行高代替高度避免haslayout。IE6,IE7下,类似inline-block属性的元素里如果有block属性的元素,如果该block haslayout,则该标签会冲破外部inline-block的显示而宽度100%显示。从使按钮自适应文字大小的效果失效,解决方法就是使用line-height代替height。
二、如何去查CSS属性的兼容性?比如inline-block哪些浏览器支持?
可以通过can I use查询
inline-block支持的浏览器有:
三、a 标签的href, title, target 是什么? title 和 alt有什么区别?如何新窗口打开链接?
href、title、target是a标签的属性。 href 属性,它指示链接的目标。 title 属性规定关于元素的额外信息。这些信息通常会在鼠标移到元素上时显示一段工具提示文本。target 属性规定在何处打开链接文档。
title 和 alt有什么区别:alt是html标签的属性,而title既是html标签,又是html属性。
- img标签的alt属性是在图片因浏览器兼容、加载失败或地址出错等原因而不显示时为浏览用户所做的代替语言,其性质为该图片的代替;只能用在img、area和input元素中(包括applet元素)。alt是替代图像作用而不是提供额外说明文字的。
- img标签的title属性,是表达该图片(img标签)的一些额外信息,比如日期或者其他非本质的信息。其性质为一种备注或者注释,鼠标过去时显示该段文字。它除了可以用在base,basefont,head,html,meta,param,script和title之外的所有标签。但是并不是必须的。
新窗口打开链接:<a href="链接的页面" target="_blank">新窗口打开</a><br />
四、display: none , visibility: hidden, opacity:0 有什么作用?有什么区别?
display: none:隐藏对象,不占据空间,会改变页面布局。
visibility: hidden:隐藏对象,占据空间,不会改变页面布局,但是不会触发该元素已经绑定的事件。
opacity:0:将元素隐藏起来,但不会改变页面布局,并且,如果该元素已经绑定一些事件,如click事件,那么点击该区域,也能触发点击事件。
五、如何去除 a 链接的默认样式?直接在 a 链接父容器添加颜色,能否继承到当前 a 链接上?
text-decoration: none去除a链接的默认样式。
直接在 a 链接父容器添加颜色,不会继承到a链接上,由于css层叠,a元素继承自div的样式(color:red)被浏览器的a元素的默认样式给覆盖了。
浏览器本身对 a 标签有默认样式,直接对 a 标签指定从父级 div 继承下来的优先级没有选择器高,覆盖不到。
结果为: