麻烦老师细心检查一遍代码是否正确书写规范,非常感谢(●'◡'●)!

麻烦老师细心检查一遍代码是否正确书写规范,非常感谢(●'◡'●)!


<!DOCTYPE html>

<html>

<head>

    <style type="text/css">

        *{

            margin:0px;

            padding:0px;

        }

        .content{

            width:670px;

            /*background-color:pink;*/

            border:1px dashed  #ccc;

            overflow:hidden;

            zoom:1;

            padding-bottom:10px;

            margin:0px auto;

        }

        img{

            width:200px;

            height:80px;

        }

        .one,.two,.three,.four,.five,.six{

            float:left;

            margin:10px;

            border:1px solid #ccc;

            

        }

        span{

            font-size:15px;

            margin-left:5px;

            height:30px;

            line-height:20px;

        }

    </style>

</head>

<body>   

    <div class="content">

        <div class="one">

            <img src="http://img1.sycdn.imooc.com/climg//590fe9770001e63102400135.jpg"/><br/>

            <span>欢迎来到慕课网学习新知识!</span>

        </div>

        <div class="two">

            <img src="http://img1.sycdn.imooc.com/climg//590fe97d00011bda02400135.jpg"/><br/>

            <span>欢迎来到慕课网学习新知识!</span>

        </div>

        <div class="three">

            <img src="http://img1.sycdn.imooc.com/climg//590fe982000150ba02400135.jpg"/><br/>

            <span>欢迎来到慕课网学习新知识!</span>

        </div>

        <div class="four">

            <img src="http://img1.sycdn.imooc.com/climg//590fe9770001e63102400135.jpg"/><br/>

            <span>欢迎来到慕课网学习新知识!</span>

        </div>

        <div class="five">

            <img src="http://img1.sycdn.imooc.com/climg//590fe97d00011bda02400135.jpg"/><br/>

            <span>欢迎来到慕课网学习新知识!</span>

        </div>

        <div class="six">

            <img src="http://img1.sycdn.imooc.com/climg//590fe982000150ba02400135.jpg"/><br/>

            <span>欢迎来到慕课网学习新知识!</span>

        </div>

    </div>

</body>

</html>


正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,代码实现的很简洁,可以把父盒子的padding-bottom去掉:

http://img1.sycdn.imooc.com//climg/5e23ea8709e58e5005280278.jpg

因为每一列都设置的有margin,所以可以不需要加这个。

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

  • bao_ 提问者 #1
    这个不是内下边距吗?我看它的内容距下边还有一小块距离。
    2020-01-19 13:37:26
  • 好帮手慕粉 回复 提问者 bao_ #2
    同学你好,加不加都可以的,这个练习题主要考察的就是清除浮动,样式不用跟效果图做的完全一样的。如果我的回答帮助到了你,欢迎采纳,祝学习愉快~
    2020-01-19 13:44:02
  • bao_ 提问者 回复 好帮手慕粉 #3
    好的老师?谢谢你?
    2020-01-19 13:47:47
好帮手慕粉 2020-01-19 10:40:31

同学你好,代码是正确的。继续加油,祝学习愉快~

  • 提问者 bao_ #1
    老师我这个代码书写规范不??有需要改进的嘛
    2020-01-19 12:15:08
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师