0

尝试使用 div 进行上述操作。每个矩形（一长 + 右侧的正方形）应该是一个单位。那么它应该是 div 内的 div 吗？..（我显然是新手，所以感谢您的帮助！）。框架的大小不应该是固定的，而是有弹性的。

<body>
<div id="frame">
    <div id="div1"></div>           
    <div id="div2"></div>
    <div id="div3"></div>
    <div id="div4"></div>
    <div id="divSettings"></div>
</div>
</body>

（在样式表中为每个 div 制作边框）

4

4 回答 4

0

我会将“框架”div 设置为包含 div，并使用 float:right、float"left、br 标签和 widht=xx% 属性设置所有其他 div。

于 2013-09-30T03:04:05.210 回答
0

我会创建这样的东西，它在 div 中使用 div，宽度为 %，并将float:right内部 div 放在右侧

/* HTML */
<div id="frame">
    <div class='row'><div class='inner'></div></div>
    <div class='row'><div class='inner'></div></div>
    <div class='row'><div class='inner'></div></div>
    <div class='row'><div class='inner'></div></div>
    <div id="divSettings"></div>
</div>

/* CSS */
#frame {
    width: 350px;
    height: 460px;
}
.row {
    height:100px;
    width: 100%;
}
.inner {
    float: right;
    width: 33%;
    height:100%;
    border-left:1px solid black;
}
#divSettings {
    height: 50px;
    width:100%;
}
div:not(.inner) {
    border: 1px solid black;
}

注意：设置高度时frame，不要忘记包括内部div的顶部和底部边框的附加高度

于 2013-09-30T03:13:11.233 回答
0

小提琴

<div class="left" style="float:left; width:70%">
    <div class="left1">left 1</div>
    <div class="left1">left 2</div>
    <div class="left1">left 3</div> 
</div>

<div class="right" style="float:right; width:30%">
<div class="right1">right 1</div>
    <div class="right1">right 2</div>
    <div class="right1"> right3</div> 
</div>
<div class="footer" style="clear:both;">footer
</div>
于 2013-09-30T03:17:35.400 回答
0

例子

通过这种方式，我们创建行并将我们的两个 div 放入这一行。

还有另一种方法可以让所有 div 相对放置在div容器内：

例 2

现在由您来决定什么更适合您使用...

于 2013-09-30T03:26:57.420 回答