老师请问代码有改进的地方吗?
来源:4-11 编程练习
慕网Yellow_Peach
2021-03-29 22:28:01
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<style type="text/css">
#num1{
width: 760px;
border:1px solid darkgray;
float:left;
}
#div1{
margin: 5px 5px 5px 5px;
padding:0px 0px 5px 0px;
float: left;
border: 1px solid darkgray;
}
#div2{
margin: 5px 5px 5px 5px;
padding:0px 0px 5px 0px;
float: left;
border: 1px solid darkgray;
}
#div3{
margin: 5px 5px 5px 5px;
padding:0px 0px 5px 0px;
float: left;
border: 1px solid darkgray;
}
#div4{
margin: 5px 5px 5px 5px;
padding:0px 0px 5px 0px;
float: left;
border: 1px solid darkgray;
}
#div5{
margin: 5px 5px 5px 5px;
padding:0px 0px 5px 0px;
float: left;
border: 1px solid darkgray;
}
#div6{
margin: 5px 5px 5px 5px;
padding:0px 0px 5px 0px;
float: left;
border: 1px solid darkgray;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div id="num1">
<div id="div1">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"><br>
<label>欢迎来到慕课网学习新知识</label>
</div>
<div id="div2">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"><br>
<label>欢迎来到慕课网学习新知识</label>
</div>
<div id="div3">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"><br>
<label>欢迎来到慕课网学习新知识</label>
</div>
<div id="div4">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"><br>
<label>欢迎来到慕课网学习新知识</label>
</div>
<div id="div5">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"><br>
<label>欢迎来到慕课网学习新知识</label>
</div>
<div id="div6">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"><br>
<label>欢迎来到慕课网学习新知识</label>
</div>
</div>
</body>
</html>
1回答
同学,你好!同学的代码实现了效果,但是还有需要优化的地方:
1、6个div设置的css样式一样,可以使用逗号选择器。或者可以定义为相同名字的类选择器
祝学习愉快!
相似问题