老师 麻烦看一下我这个方法可以实现么？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS布局</title>
<style type="text/css">
.box{
width: 500px;
height: 200px;
margin:0 auto;
border:1px solid #aaa;
background-color: #ababab;
color: #fff;
font-weight: bolder;
position: relative;
}
.box div{
width: 200px; /* 实际开发中如果宽高未知的话是用PS测量么？ 如果不设置宽高的话有什么好的办法实现文字水平居中和垂直居中啊*/
height: 40px;
font-size: 16px;
text-align: center;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
margin: auto auto;/*这个方法与大盒子200px 减去40px , 剩余160px , 除以2 等于80px 的方法那个更好？*/
}
</style>
</head>
<body>
<div class="box">
<div>
欢迎大家来到慕课网学习！
来到慕课网学习!
</div>
</div>
</body>
</html>
春节将至 老师们辛苦了！万分感谢老师们的耐心讲解。
正在回答
同学，你好。
你这个方法是可以实现的。与那个计算的方法相比较，同学的这个方法更好一些，省去了计算的麻烦。
实际开发中，我们会有UI给我们相应的设计图纸，图纸上都有明确的尺寸标注，不需要我们自己去测量。
不设置宽高，实现文本水平和垂直居中的话，可以用transform这个属性来实现，如图：
这个属性我们后面的课程会进行详细的讲解，同学这里只需了解即可。
祝学习愉快！
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星