display:
-
none:隐藏该元素并且该元素所占的空间也不存在了。
-
block; 显示元素
visibility:
-
hidden 隐藏该元素但是该元素所占的内存空间还存在,即“隐身效果”。
-
visible 显示元素
3、垂直对齐方式 vertical-align属性
常用的值:
-
vertical-align: baseline; 默认值,基线对齐 英文字母x的下端
-
vertical-align: top; 顶端对齐
-
vertical-align: bottom; 底端对齐
-
vertical-align: middle; 中部对齐
典型应用
-
图片与图片垂直方向的对齐
-
图片与文字垂直方向的对齐
-
图片与文本框垂直方向的对齐
图片下方间隙问题
图片间隙问题产生的原因:父元素没有设置高度,由图片撑开,就会有图片三像素问题
-
为img标签的父元素设置font-size:0;(水平方向和垂直方向间隙)或line-height:0;
-
将img标签转成块级元素img{ display: block;}
-
为img标签设置垂直对齐方式img{ vertical-align: top|bottom|middle; }
-
为img标签的父元素设置高度,高和图片的高一样
图片居中
方法1:父元素{text-align:center}
方法2:图片{display:block;margin:0 auto;}