我如何改变我的<hr>标签的厚度
我想改变CSS中水平线的粗细。 我知道它可以像HTML一样在HTML中完成 -
<hr size="10">
但是我听说这在MDN这里已经提到过了。 在CSS中，我尝试使用height:1px但它不会改变厚度。 我希望<hr>线的厚度为0.5px 。
我在Ubuntu上使用Firefox 3.6.11
为了保持一致性，请删除任何边框并使用<hr>厚度的高度。 添加背景颜色将使用指定的高度和颜色对<hr>进行设置。
在你的样式表中：
hr {
border: none;
height: 1px;
/* Set the hr color */
color: #333; /* old IE */
background-color: #333; /* Modern Browsers */
}
或者像你一样内联：
<hr style="height:1px;border:none;color:#333;background-color:#333;" />
这里更长的解释
在浏览器中进行亚像素渲染
子像素渲染很棘手。 实际上，您无法期望显示器渲染的像素细线不足。 但是可以提供子像素尺寸。 根据浏览器的不同，它们呈现的方式不同 请查看John Resig的博客文章。
基本上，如果您的显示器是液晶显示器并且您正在绘制垂直线，则可以轻松绘制1/3像素线。 如果你的背景是白色的，给你的#f0f线条颜色。 眼睛这条线将是1/3像素宽。 虽然它会有一些颜色，但如果你放大显示器，你会发现整个像素中只有一个部分（包括RGB）会变暗。 这非常适用于精细类型提示，即ClearType。
但水平线只能是全像素高。 这是液晶显示器的技术局限性。 CRT的三角荧光粉更加复杂（除非它们是光栅格式，即Sony Trinitron），但这是一个不同的故事。
基本上提供一个子像素维度并期望它以这种方式呈现与期待整数变量存储1.2034759349数量相同。 如果你明白这是不可能的，你应该明白监视器不能渲染子像素尺寸。
跨浏览器安全风格
但混合的水平规则通常使用颜色来完成。 所以如果你的背景是白色的（ #fff ），你总是可以让你的HR 非常轻。 像#eee 。
非常轻的横向规则的跨浏览器安全风格是：
hr
{
background-color: #eee;
border: 0 none;
color: #eee;
height: 1px;
}
并使用CSS文件而不是嵌入式样式。 它们为整个网站提供了一个中心定义，而不仅仅是一个特定的元素。 它使可维护性好得多。
我正在寻找最短的方式来绘制一个1px线，因为整个分离CSS的负载不是最快或最短的解决方案。
对于HTML5，WAS是1px小时的更短路径：<hr noshade>但是.. <hr>的noshade属性在HTML5中不受支持。 改用CSS。 （之前使用的其他属性，如大小，宽度，对齐）...
现在，这一个是非常棘手的，但如果最简单的1px小时需要运作良好：
变化1，黑色小时:(黑色的最佳解决方案）
<hr style="border-bottom: 0px">
输出：FF，Opera - 黑色/ Safari - 深灰色
变化2，灰色小时（最短！）：
<hr style="border-top: 0px">
输出：Opera - 深灰色/ FF - 灰色/ Safari - 浅灰色
变化3，根据需要使用COLOR：
<hr style="border: none; border-bottom: 1px solid red;">
输出：Opera / FF / Safari：1px红色。
链接地址: http://www.djcxy.com/p/89121.html