css - HTML - CSS 人力资源问题

Question

您好，我今天在配置我的 html 页面时遇到了问题。 我的示例代码是:

<div style="width: 100%">
    <div style="width: 80%; float: left;">
        Text on div 80%
    </div>
    <div style="width: 20%; float:right">
        text on div 20%
    </div>
</div>
<hr>Text after hr

如您所见，hr 没有完成他的工作，因为它没有显示在我设置的位置。

应该是这样的:

<div style="width: 100%">
    <div style="width: 80%; float: left;">
        Text on div 80%
    </div>
    <div style="width: 20%; float:right">
        text on div 20%
    </div>
</div>Only if i add text in this position the following hr works, how to fix it?
<hr>Text after hr

问题是在 div 之后 hr 没有出现!

我需要先放一些文字..为什么会这样？

Answer 1

<hr>就在那里，只是小到你需要电子显微镜才能看到它。尝试:

<hr style="width: 100%; float:left">Text ...

示例:

http://jsfiddle.net/pqaukpjf/7/

另请注意:

HTML 4.01 之间的差异和 HTML5

• 在 HTML5 中，<hr>标签定义主题休息。
• 在 HTML 4.01 中，<hr>标签代表一条水平线。

<hr>标签现在是用语义术语定义的，而不是表示术语。 HTML5 中删除了所有布局属性。请改用 CSS。