CSS中怎么实现div垂直居中，相信很多没有经验的人对此束手无策，为此本文总结了问题出现的原因和解决方法，通过这篇文章希望你能解决这个问题。<!DOCTYPE html>
CSS中怎么实现div垂直居中，相信很多没有经验的人对此束手无策，为此本文总结了问题出现的原因和解决方法，通过这篇文章希望你能解决这个问题。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>CSS实现div居中</title>
<style>
#main {
position: absolute;
background-color: blue;
width:400px;
height:200px;
left:50%;
top:50%;
margin-left:-200px;
margin-top:-100px;
border:1px solid #00F;
}
#content {
position: absolute;
background-color: yellow;
width: 200px;
height: 100px;
left:50%;
top:50%;
margin-left:-100px;
margin-top:-50px;
text-align: center;
line-height:100px;
}
</style>
<body>
<div id="main">
<div id="content">
Sun
</div>
</div>
</body>
</html>看完上述内容，你们掌握css中怎么实现div垂直居中的方法了吗？如果还想学到更多技能或想了解更多相关内容，欢迎关注编程网node.js频道，感谢各位的阅读！
--结束END--
本文标题: css中怎么实现div垂直居中
本文链接: https://www.lsjlt.com/news/67789.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑，方便收藏和打印～
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
官方手机版
微信公众号
商务合作
0