美文网首页
CSS布局--水平&垂直对齐

CSS布局--水平&垂直对齐

作者: 小小全_ | 来源:发表于2020-05-21 14:40 被阅读0次
设置容器上下 padding 相同实现垂直居中和使用 line-height=height 实现垂直居中仅对单行文本有效,当文本行数超过单行时:

1)padding:文本仍然处于容器垂直居中的位置,但是容器的 height 会随着文本行数的增加而增大;
2)line-height=height:容器的 height 不变,line-height 是文本的行间距,文本会溢出容器显示;
3)多行文本可使用 vertical-align: middle; 来实现元素的垂直居中,但是如果子元素的内容体积大于父元素的内容体积时,仍然会溢出,后面需要使用文字溢出处理来解决。

相关文章

网友评论

      本文标题:CSS布局--水平&垂直对齐

      本文链接:https://www.haomeiwen.com/subject/xfwzohtx.html