3-4看下还有什么可以改进的地方

来源:3-4 编程练习

Bohemian_Yoke

2018-06-21 00:25:31

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style>

*{

margin: 0px;

padding: 0px;

}

.qb{

width: 1200px;

height: 500px;

margin: 0 auto;

border: 2px red solid;

background: #ccc;

}

.one{

overflow: hidden;

zoom:1;

}

.one .a{

float: left;

margin: 50px 70px;

}

.two .a{

float: left;

margin: 50px 70px;

}

</style>

</head>

<body>

<div class="qb">

<div class="one">

<div class="a">

<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">

<br>

欢迎来到慕课网学习!

</div>

<div class="a">

<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg">

<br>

欢迎来到慕课网学习!

</div>

<div class="a">

<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">

<br>

欢迎来到慕课网学习!

</div>

</div>

<div class="two">

<div class="a">

<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">

<br>

欢迎来到慕课网学习!

</div>

<div class="a">

<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg">

<br>

欢迎来到慕课网学习!

</div>

<div class="a">

<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">

<br>

欢迎来到慕课网学习!

</div>

</div>

</div>

</body>

</html>


写回答

1回答

chrismorgen

2018-06-21

效果完成的还不错,但是相同设置使用同一个样式即可,不需要定义两个相同的样式。修订之后的代码如下图,祝学习愉快~

http://img.mukewang.com/climg/5b2b09720001a77802530544.jpg

0

0 学习 · 10204 问题

查看课程