内联元素居中

最新推荐文章于 2023-11-22 14:48:11 发布

aら　淼

最新推荐文章于 2023-11-22 14:48:11 发布

阅读量169

点赞数

分类专栏：前端文章标签： css

原文链接：https://blog.csdn.net/lwang_hello/article/details/79747336

版权

前端专栏收录该内容

34 篇文章 0 订阅

订阅专栏

父元素：
height:100px;
line-height:100px; // 与高相同
text-align:center;
子元素:
display:inline;
vertical-align: middle;

适用图片、文字

<div>
    <div class="wrapper">
      <span>我是文字</span>
    </div>
    <div class="wrapper2">
      <div>我是文字</div>
    </div>
  </div>
.wrapper {
  height: 200px;
  width: 200px;
  background-color: antiquewhite;
  line-height: 200px;
}
.wrapper2 {
  height: 200px;
  width: 200px;
  background-color: antiquewhite;
  line-height: 200px;
  div{
      height: 20px;
      width: 20px;
  }
}