老师，请帮忙看看我的代码有什么问题
老师，以下是我仿照视频里的案例写的代码，不能实现预期效果。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS布局</title>
<style type="text/css">
/*此处写代码*/
* {
padding: 0;
margin: 0;
}
h1 {
text-align: center;
}
.a {
float: left;
width: 50%;
padding: 10px;
}
.a img {
width: 426px;
height: 240px;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<h1>ENJOY THE LIFE</h1>
<div class="a">
<img src="http://img1.sycdn.imooc.com/climg//58f829090001a4b504260240.jpg">
<div class="text">Life is like a book, just read more and more refined, more write more carefully. When read, mind open, all things have been indifferent to heart. Life is the precipitation.</div>
</div>
<div class="a">
<img src="http://img1.sycdn.imooc.com/climg//58f8290f0001558804260240.jpg">
<div class="text">Life is like a cup of tea, let people lead a person to endless aftertastes. You again good taste, it will always have a different taste, different people will have different taste more.</div>
</div>
</body>
</html>以下是案例里的代码，div class为m-com，有5条css。
其实我也知道几种实现预期效果的方法，但是不明白为什么我仿照案例不能实现相应的效果。我的代码与案例里的代码有什么不同？是哪里出错了呢？如果想用案例里的那种实现方式应该怎样改？还请老师帮帮我，谢谢！
15
收起
正在回答 回答被采纳积分+1
3回答
guly
2020-05-15 11:12:37
你好，修改您的代码效果如下：
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS布局</title>
<style type="text/css">
/*此处写代码*/
* {
padding: 0;
margin: 0;
}
h1 {
text-align: center;
}
.test{
width:100%;
text-align: center;
background-color:red;
}
.a1 {
width: 460px;
float:left;
position: relative;
margin-left: 10%;
}
.a2 {
width: 460px;
float:left;
position: relative;
}
.text{
width:460px ;
/*padding-top:20px;*/
font-size: 20px;
font-weight: bold;
color:#7D7C7F;
padding-bottom: 50px;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<h1>ENJOY THE LIFE</h1>
<div class="test">
<div class="a1">
<img src="http://img1.sycdn.imooc.com/climg//58f829090001a4b504260240.jpg">
<div class="text">Life is like a book, just read more and more refined, more write more carefully.
When read, mind open, all things have been indifferent to heart. Life is the precipitation.</div>
</div>
<div class="a2">
<img src="http://img1.sycdn.imooc.com/climg//58f8290f0001558804260240.jpg">
<div class="text">Life is like a cup of tea, let people lead a person to endless aftertastes. You again good taste, it will always have a different taste, different people will have different taste more.</div>
</div>
</div>
</body>
</html>如果解决您的问题请采纳，祝学习愉快！
PHP小白零基础入门
- 参与学习 人
- 提交作业 626 份
- 解答问题 4930 个
想要学好Web后端开发的中流砥柱语言，本阶段为你轻松铺就扎实的基础，从前端网页布局的搭建到后台PHP开发，助你从零基础到掌握主流开发语言。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星