博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML水平居中和垂直居中的实现方式
阅读量:5074 次
发布时间:2019-06-12

本文共 671 字,大约阅读时间需要 2 分钟。

父元素是块元素,根据子元素不同分为以下几种:   1.子元素是行内元素:     a.水平居中:在父元素上设置text-align:center;     b.垂直居中:在行内子元素上设置行高与父元素相同line-height=parent.height;
  2.子元素是多行内联文本或图片:     a.水平居中:父元素设置text-align:center;     b.垂直居中:父元素设置display:table-cell;vertical-align:middle;   3.子元素是块元素:     a.水平居中:子元素设置左右自动margin: 0 auto;
    b.垂直居中:与多行内联文本或图片处理方式一致display:table-cell;vertical-align:middle;   4.子元素是不定宽块元素:     a.水平居中:父元素设置text-align:center;     b.垂直居中:可给分页的ul加行高line-height=parent.height;     c.底边居中:更为常用,与多行内联文本或图片垂直处理方式一致display:table-cell;vertical-align:bottom; 表格:     a.水平对齐:table设置text-align:center;     b.垂直对齐:table中设置vertical-align:middle;

转载于:https://www.cnblogs.com/fantianlong/p/9939753.html

你可能感兴趣的文章