如何水平划分网页？

我正在学习HTML。我正在阅读书中的<div>标签。我了解它是如何将网站分成垂直片段，但我也看到了人们在边栏上使用<div>标签的示例。 <div>标签如何水平工作？如何水平划分网页？

2011-06-29 Fahad Uddin

请将HTML标签包装在反引号（'）中。 – SLaks

对不起。正在编辑它，但感谢Jared。他在我之前做过:) –

如果你还没有阅读[box model]（http://www.w3.org/TR/CSS2/box.html）。 –

要让它们如此并排，您需要使用CSS。默认情况下div元素的display属性设置为block。因此，它后面的元素通常会出现在下面。

要设置几个栏目可以说你具备以下条件：

<div class="container"> 
    <div class="left"></div> 
    <div class="right"></div> 
</div>

您可以设置列通过应用CSS规则的类：

<style type="text/css"> 
    .container { 
     width:500px; 
    } 
    .left { 
     width:250px; 
     float:left; 
    } 
    .right { 
     width:250px; 
     float:right; 
    } 
</style>

总之，即时给它一个容器具有最大宽度。这不是必需的，但通常是这样做的。然后我将这两个div设置为容器宽度的一半，然后将浮动放在它上面。所以所有的元素都会粘在它旁边。浮动权是可选的。但是，如果将容器制作得更宽一些，则右侧的div将粘在右侧。

来源

2011-06-29 01:33:52 agmcleod

http://jsfiddle.net/Buyar/ –

再次感谢贾里德:) –

我需要记住有时使用该网站:)。只需要添加，如果你拿出容器div，两个中间div将使用全宽。所以右侧会出现在屏幕的最右侧。 – agmcleod

它被认为是块元素，宽度为100％。

我建议你在文本编辑器&中通过添加背景色和其中的一些内容来尝试它。

来源

2011-06-29 01:30:22 bchhun

如何水平划分网页？

回答

相关问题