line-height有什么作用?
line-height是用于行高,另当line-height等于height时,可显示垂直居中效果,具体使用方法如下:
.a{
background-color: red;
border: solid 1px black;
line-height: 0;
}
.b{
background-color: red;
border: solid 1px black;
line-height: 1;
}
.c{
background-color: red;
border: solid 1px black;
line-height: 2;
}
.d{
background-color: red;
border: solid 1px black;
line-height:40px;
}
.e{
background-color: red;
border: solid 1px black;
height: 80px;
line-height:80px;
}
效果
行高.png
如何去查CSS熟悉的兼容性?
CSS标签兼容性可在caniuse查询,下面是inline-block在各浏览器中的支持情况:
caniuse示例.png
知识点
利用表格的的属性把图片居中的方法:
display: table-cell;
text-align: center;
a 标签的href, title, target 是什么? title 和 alt有什么区别?
- a 标签的href, title, target 是什么?
- href规定链接指向的页面的URL,也可以链接到“锚点”。“锚点”可以使当前页面也可以是外部页面。例如:
<a href="#abc" title="百度">链接</a>
就会链接到当前页面的abc位置
- title 属性规定关于元素的额外信息。例如:
<a href="http://www.baidu.com/" title="百度">链接</a>
当鼠标移到"链接"上时,会出现"百度"两个字的提示。
- target 属性规定在何处打开链接文档。
- _blank在新窗口中打开被链接文档。例如:
<a href="http://www.baidu.com/" target="_blank">链接</a>
- _self默认。在相同的框架中打开被链接文档。
- _parent在父框架集中打开被链接文档。
- _top在整个窗口中打开被链接文档。
- title 和 alt有什么区别?
title属性规定关于元素的额外信息,用于链接
的描述。
alt 属性指定了替代文本,用于在图像
无法显示或者用户禁用图像显示时,代替图像显示在浏览器中的内容。也可在 鼠标移至图像上是显示描述。
display: none , visibility: hidden, opacity:0有什么作用?有什么区别?
- display: none是将元素完全隐藏,并且元素不占用页面空间,所占空间会被其他元素占用,功能完全消失。
- visibity:hidden是将元素隐藏,所占用空间不变,只是不显示元素,功能完全消失。
- opacity:0 是把元素的透明度设置为0,就是完全透明,透明度在0-1内可调,元素的功能正常。
如何去除 a 链接的默认样式?直接在 a 链接父容器添加颜色,能否继承到当前 a 链接上?
去除a 链接的默认样式:
a{
text-decoration: none;
}
a 链接不能继承父容器的颜色,需单独添加样式。