替代水平规则标签`<hr />`在html5中工作

Question

我目前正在处理一些日历的html（在html5中），我正在尝试添加彩色水平线。我一直在使用水平规则标签bind_all，但我很难让大部分属性都能正常工作。

这就是我想要的：

<hr>

我读到某些属性在html5中不起作用......唯一有效的是宽度标记。其他人都没有做任何事情！

我怎样才能让它发挥作用？有没有更好的方法来解决这个问题？

Answer 1

使用CSS规则

hr.someClass {
  background-color: purple;
  width: 120%;
  height: 12px;
  border-top: 1px solid black
}

<hr class="someClass">

Answer 2

您可以添加一个border-top的div，如下所示：

＆＃13;

＆＃13;

<div style="border-top: 6px solid purple"></div>

＆＃13;

＆＃13;

＆＃13;

使用外部样式（总是更好）：

＆＃13;

＆＃13;

.horizontal-rule {
  border-top: 6px solid purple;
}

＆＃13;

<div class="horizontal-rule"></div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

在HTML 4.01中，<hr>标记表示水平规则。在HTML5中，<hr>标记定义了主题中断。 HTML5中也不支持align，size和width等属性。

正确的替代方法是将div定义为：

<强> HTML

<div class="hr"></div>

<强> CSS

.hr {
    border-top: 6px solid purple;
    width: 120%;
}

Answer 4

您可以使用

<div style="background-color: purple; text-align: left; width: 120%; height: 6px;"></div>

在这里你可以给出＆＃34;背景颜色＆＃34;对于＆＃34; hr＆＃34;线条和高度作为边框高度。 我希望这会有效：）