请老师帮忙检查下，谢谢！
来源：2-7 编程练习
慕仔4144401
2019-11-06 11:07:06
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS布局</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
img{
display:both;
}
.header{
width:1000px;
margin:50px auto;
}
.header .h1{
text-align: center;
font-family:"宋体";
font-weight:bold;
font-size:24px;
margin-bottom:20px;
}
.header .center .icon{
float: left;
width:50%;
text-align:center;
}
.header .center .icon img{
width:426px;
height:240px;
}
.header .center .icon p{
text-align: center;
font-family:"宋体";
font-weight:bold;
font-size:15px;
}
</style>
</head>
<body>
<div class="header">
<div class="h1">
ENJOY THE LIFE
</div>
<div class="center">
<div class="icon">
<img src="http://climg.mukewang.com/58f829090001a4b504260240.jpg"/>
<p>
life is like a book,just read more and more <br/>refined.more weite more carefully.when read,<br/>mind open.all things hava been indifferent to<br/>heart.life is the precipitation.
</p>
</div>
<div class="icon">
<img src="http://climg.mukewang.com/58f8290f0001558804260240.jpg"/>
<p>
life is like a book,just read more and more <br/>refined.more weite more carefully.when read,<br/>mind open.all things hava been indifferent to<br/>heart.life is the precipitation.
</p>
</div>
</div>
</div>
</body>
</html>
1回答
-
你好同学，文字对齐方式不对，不是居中的
再观察一下效果图，文字是左对齐的，参考如下调整：
文字里面的换行标签都去掉，不需要强制换行。文字的父容器设置了宽度，放不下的文字自然会换行显示了。
样式调整如下
祝学习愉快，望采纳。
0
相似问题