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

我目前正在制作一些日历的html(在html5中),我正在尝试添加彩色水平线.我一直在使用水平规则标签,

这就是我要的:

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

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

使用CSS规则

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