您的位置 首页 css教程

css中有哪些方法可以实现垂直居中

css实现垂直居中的方法如下:

1、利用line-height实现居中,这种方法适合纯文字类的;

<!-- css -->
<style>
.parents {
  height: 400px;
  line-height: 400px;
  width: 400px;
  border: 1px solid red;
  text-align: center;
}

.child {
  background-color: blue;
  color: #fff;
}
 </style>
</head>

<body>
<!-- html -->
<div class="parents">
   <span class="child">css布局,实现垂直居中</span>
</div>
</body>

效果:

cf2107043f8587b8a39d71d4f3c1811.png

关于作者: admin

热门文章

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

网站地图