3-4编程问题
来源：3-4 编程练习
幻梦若兮
2018-07-20 21:54:27
请问我写的代码还有需要修改的地方吗？以及我想知道还有没有另外一种更高效率的方法去写。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>float</title>
<style type="text/css">
*{margin: 0;padding: 0;}
ul{list-style:none;}
.text1,.text2,.text3,.text4,.text5,.text6{text-decoration: none;font-size: 17px;}
.contaniner{
width: 810px;
height: 360px;
margin-top: 30px;
margin-left: 30px;
border:2px green dashed
}
.main{margin:25px;}
/*第一行*/
.logo1{width: 1000px;}
.smalltu1{width: 260px;height: 135px;float: left;}
.smalltu2{width: 260px;height: 135px;float: left;}
.smalltu3{width: 260px;height: 135px;float: left;}
.text1{float: left;}
.text2{float: left; padding-left: 36px;}
.text3{float: left;padding-left: 42px;}
/*第二行*/
.logo2{width: 1000px;}
.smalltu4{width: 260px;height: 135px;float: left;}
.smalltu5{width: 260px;height: 135px;float: left;}
.smalltu6{width: 260px;height: 135px;float: left;}
.text4{float: left;}
.text5{float: left; padding-left: 36px;}
.text6{float: left;padding-left: 42px;}
</style>
</head>
<body>
<div class="contaniner">
<!--第一行-->
<div class="main">
<div class="logo1">
<div class="smalltu1"><img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"></div>
<div class="smalltu2"><img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"></div>
<div class="smalltu3"><img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"></div>
<div class="text1"><b>欢迎来到慕课网学习新知识！</b></div>
<div class="text2"><b>欢迎来到慕课网学习新知识！</b></div>
<div class="text3"><b>欢迎来到慕课网学习新知识！</b></div>
</div>
<!--第二行-->
<div class="logo2">
<div class="smalltu4"><img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"></div>
<div class="smalltu5"><img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"></div>
<div class="smalltu6"><img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"></div>
<div class="text4"><b>欢迎来到慕课网学习新知识！</b></div>
<div class="text5"><b>欢迎来到慕课网学习新知识！</b></div>
<div class="text6"><b>欢迎来到慕课网学习新知识！</b></div>
</div>
</div>
</div>
</body>
</html>
1回答
-
完成的效果不错，但是效果图中每一个图片下面对应一行描述文字，建议将图片和描述文字作为一个整体，而不是将图片和文字全部单独分开，如下：
然后再根据实际情况调整一下样式。
如果对你有帮助，请采纳，祝学习愉快~
0
相似问题