Question

这些是说明 1.制作div，给它一类'feature_set_1_1'

在上面的div中制作一组3个div，并排坐着，一起占据身体宽度的75％
添加适当的ID或类以执行以下操作：

- 给你的div设定一个高度

- 通过您希望的任何方法在第1和第2 div之间留出5％的空间

- 在第二和第三div之间留出5％的空间而不进一步改变第二个div

- 这三个div应该并排在同一条线上

我必须使用分配给父div的类来实现这一点，而且我找不到使用class feature_set_1_1来完成这项工作的方法。

到目前为止，这是我的代码：

<!DOCTYPE html>
<html lang="en-US">
    <head>
        <title>Layout_1</title>
        <meta charset="UTF-8">
        <style>
            .feature_set_1_1 {
                display: inline-flex;
                background: blue;
                width: 75%;
                height: 100px;
            }
            #1_1 {
                margin: 5%;
                display: inline-block;
            }
            #1_2 {
                margin-right: 5%;
                display: inline-block;
            }
            #1_3 {
                display: inline-block;
            }
        </style>
    </head>
    <body>
        <div class="feature_set_1_1">
            <div id="1_1">Figure1</div>
            <div id="1_2">Figure2</div>
            <div id="1_3">Figure3</div>
        </div>
    </body>
</html>

Answer 1

尝试以下它可能会对您有所帮助。

＆＃13;

.feature_set_1_1 {
                display: inline-flex;
                background: green;
                width: 75%;
                height: 100px;
            }
            #div_1 {
                margin-right: 5px;
                width:25%;
                display: inline-block;
                background:yellow !important;
            }
            #div_2 {
                margin-right: 5px;
                display: inline-block;
                width:25%;
                background:pink !important;
            }
            #div_3 {
                display: inline-block;
                width:25%;
                background:red !important;
            }

＆＃13;

<!DOCTYPE html>
<html lang="en-US">
    <head>
        <title>Layout_1</title>
        <meta charset="UTF-8">
        
    </head>
    <body>
        <div class="feature_set_1_1">
            <div id="div_1">Figure1</div>
            <div id="div_2">Figure2</div>
            <div id="div_3">Figure3</div>
        </div>
    </body>
</html>

＆＃13;

如何在1个父div中并排制作3个div，宽度占据页面的75％？

1 个答案: