如何制作两个色调的hr标签？

Question

我正在制作一条横穿标题底部的分隔线。它必须是两个像素高和两个色调。顶部像素必须一直水平为灰色，底部像素必须为白色。我很想将两个宽度为100％的一个1像素div彼此叠放，但是希望有人知道使用css和hr标签这样做的更好方法吗？

非常感谢你！

Answer 1

您应该避免使用该<hr />标记，因为它在不同的浏览器中确实不一致。老实说，我有一段时间没有看到它了。

您可以做的是将100％的宽度设置<p>为顶部和底部的颜色-http://jsfiddle.net/zSXya/

p.separator {
    height: 0;
    width: 100%;
    border: 0;
    border-top: 1px solid red;
    border-bottom: 1px solid green;
}