创建无限水平线

Question

我想创建一个无限的水平div。但是，我不知道该怎么做。

有人可以帮助我使用this code作为起点吗？

请看看this image，了解这个无限水平div应该如何。

谢谢！

Answer 1

通过“无限”，我假设你的意思是wiewport / window的结尾。你可以尝试一个绝对定位的元素;

这将是一个叠加层，出现在正常文档流程中的任何内容之上

<强> HTML

<div id="line">&nbsp;</div>

<强> CSS

#line {
    position: absolute;
    right: 0;
    margin-left: 100px;
    left: 50%; /* seeing as content is centered, make margin-left start at center of page */
    bottom: 10%;
    height: 20px;
    background-color: red;
}

演示于：http://jsfiddle.net/PstWc/2/

Answer 2

您可以使用1px高div设置为100％宽度：

 <div class="inf_line">
    &nbsp;
 </div>


.inf_line {width: 100%; height: 1px; background-color: #333; margin-bottom: 10px;}

Example

可能不是最优雅的方式，但这是一种方式。