3-4作业提交

来源:3-4 编程练习

qq_慕斯7214945

2020-07-26 18:01:04

<!DOCTYPE html>

<html>

<head>

        <!-- 此处编写样式 -->

        <style>

        *{margin: 0; padding:0;}

        .container{

            border:1px dashed #ccc;

            width: 800px;

            margin: 0 auto;

            overflow: hidden;

            zoom: 1;

        }

        .con{

            border:1px #ccc solid;

            display: inline-block;

            margin: 15px 10px 15px 10px;

            float: left;

        }

        .con span{

            display: block;

        }

    </style>

</head>

<body>   

        <!-- 此处写代码 --> 

        <div class="container">

        <div class="con">

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

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

        </div>

        <div class="con">

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

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

        </div>

        <div class="con">

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

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

        </div>

        <div class="con">

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

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

        </div>

        <div class="con">

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

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

        </div>

        <div class="con">

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

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

        </div>

</body>

</html>


写回答

1回答

好帮手慕码

2020-07-26

同学你好,父级宽度不合适,导致左右间隙不一样。建议优化:

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

祝学习愉快~

0

0 学习 · 40143 问题

查看课程

相似问题