老师,请看一下有没有问题
来源:3-12 编程练习
weixin_慕慕2499132
2020-06-29 14:05:19
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>vertical-align</title>
<style type="text/css">
*{padding:0px;margin: 0px;}
.warp1{
height:80px;
width: 100%;
background-color: #14191e;
text-align:center;
line-height:14px;
}
.warp1 h1{ color:#fff;
}
.warp2{
height:400px;
width: 100%;
border:1px #14191e solid;
font-size:14px;
display:table;
}
.content{
display:table-cell;
vertical-align:middle;
margin:0 auto;
}
.content p{ width:500px;
font-family: "微软雅黑";
margin:0 auto;
/*在此补充代码*/}
</style>
</head>
<body>
<div class="warp1">
<h1>欢迎来到慕课网</h1>
</div>
<div class="warp2">
<div class="content">
<p>慕课网,只学有用的!</p>
<p>慕课网(IMOOC)是IT技能学习平台。慕课网(IMOOC)提供了丰富的移动端开发、php开发、web前端、android开发以及html5等视频教程资源公开课。并且富有交互性及趣味性,你还可以和朋友一起编程。</p>
</div>
</div>
</body>
</html>
1回答
好帮手慕久久
2020-06-29
同学你好,代码中有如下问题:
1. 头部标题显示不全,如下:
原因是给“.warp1”设置了14px的行高,该行高太小了。
可做如下修改:
2. 标题h1的字体大小没有设置24px,建议添加,如下:
3. 没有给段落内容设置行高1.5em,建议添加:
如果我的回答帮到了你,欢迎采纳,祝学习愉快!
相似问题