为Internet Explorer设计小时

Question

嘿,为了尽可能地创建一个图像光源,我想创建两个音调hr.

我在现代浏览器中实现了这一点,但希望在ie6和7中实现相同的效果.

我正在使用的当前代码是

hr {
    border-bottom:1px solid #FFFFFF; 
    border-top:1px solid #dcdcdc; 
    clear:both; 
    height:0; 
    border-left:0px; 
    border-right:0px;
}

我试过,没有成功使这项工作在ie6和7,而不必专门针对浏览器.有什么想法吗？

(继承我当前的项目,我正在使用这个代码,并希望使它跨浏览器 - http://www.qwibbledesigns.co.uk/preview/aurelius/)

干杯

马特

Answer 1

我没有看到任何好的答案,但虽然我自己的工作找出了以下代码应该用于样式HR在firefox,safari,chrome和IE中看起来一致(不确定它是否在IE7下工作).

hr {
    color:#bfbfbf; /*used for IE, top color*/
    background:#bfbfbf; /*firefox and chrome, top color*/
    min-height: 0px;  /*required to get IE to render the top pixel color*/
    border-left: 0px; 
    border-right: 0px; 
    border-top: 1px solid #bfbfbf; /*Your top color*/
    border-bottom: 1px solid #ffffff; /*Your bottom color*/
}

Answer 2

尝试类似以下内容(并替换为<hr>a <div>)

div {
    /* no need for border-left/right with the following: */
    border: none;
    border-bottom:1px solid #FFFFFF; 
    border-top:1px solid #dcdcdc; 
    clear:both; 
    height:0; 
    width: 100%;
}

(并且不要忘记添加id或类以防止所有div看起来很奇怪)

注意:这适用于IE7,IE8和兼容的浏览器.可能需要对10年前的IE6进行更多调整,甚至需要图像黑客(如此经常).