<hr> 在 IOS Safari 和常规 android 浏览器上根本不显示。答案

【问题标题】：<hr> not displaying at all on IOS Safari and regular android browser.<hr> 在 IOS Safari 和常规 android 浏览器上根本不显示。
【发布时间】：2016-07-10 06:29:45
【问题描述】：

所以我有一个：

<div class="divHr">
<hr size="0.01">
</div>

.divHr hr{
display: block;
width: 100%;
border-top: 0.25px dotted #CCCCCC;
}

如果我在 Chrome / IE / Firefox 上查看它 - 此外它在移动设备上的 google chrome 上也很有效。如果我在 Safari (IOS) 或标准 Android 浏览器上查看该网站，HR 根本不会显示。我尝试不使用border: 0px; 显示边框并将size="0.01" 更改为1，但它仍然不显示 - 所以它不是边框问题。 `

我真的很想在这方面提供一些帮助，谢谢大家！

【问题讨论】：

标签： html css google-chrome safari horizontal-line

【解决方案1】：

我之前没有经历过这种情况，但是在使用 IOS 等时，我总是将 appearance: none; 添加到我的 CSS 中。

我希望这对你有用。

有关外观属性的更多信息 https://css-tricks.com/almanac/properties/a/appearance/

最好的问候，

【讨论】：

现在我已经尝试过了，没有任何效果。我认为问题不在于它出现错误，它根本不显示。还是谢谢。
@HappyDane 给它一个固定的高度怎么样？通过 CSS (!)

【解决方案2】：

好的，所以我找到了解决方案。不要使用<hr>，只需创建一个 div 并将其设置为：

.hrDiv{
border-top: 1px dotted #CCCCCC; 
width: 100%;
height: 0.01px;
border-top-style: dotted;
border-left: none;
border-right: none;
border-bottom: none;
color: #CCCCCC;
display: block;
border-color: #CCCCCC;

}

【讨论】：