删除IE上的<hr />边框样式

Question

为什么IE最容易陷入困境？无论如何,我想用单个图像替换正常的hr线,有点像 - § - 符号(在它的侧面).试图让它看起来优雅:)

看来在IE中实际摆脱边界的唯一方法是设置颜色:css值.这样做会不幸地覆盖设置为背景图像的任何内容,并使整个hr成为颜色的参数.

它不可能将它包装在一个div中,甚至不能真正应用一个类,因为将使用该站点的客户端正在使用一个所见即所得的文本编辑器,我并不喜欢黑客插入div包裹的hr.

我距离添加带有jquery的div块包装器只有一步之遥,但这似乎从根本上说是错误的(霰弹枪与核桃) - 任何建议？

Answer 1

http://blog.neatlysliced.com/2008/03/hr-image-replacement/

<style type="text/css">
    hr {
       background: url(http://placekitten.com/800/100) no-repeat;
       border: 0;
       height: 100px;
       width: 100%;
    }
</style>
<!--[if IE 7]>
<style type="text/css">
    hr {
        display : list-item;
        list-style : url(http://placekitten.com/800/100) inside;
        filter : alpha(opacity=0);
        margin-left: -10px;
        width : 0;
    }
</style>
<![endif]-->

看到它在这里工作:jsFiddle