Float 和 List Style Image 的 CSS 问题

今天把主题修改了下,主要就是把 head 图片换张新的,原来的猪好久了,没有鲜新感了,不好看了,换头新的猪,哈哈。然后把侧边栏加大一点,为什么这么干?这样可以多放点广告,给晨晨多赚钱奶粉钱,虽然现在还没有人找我投放广告,但是我相信会有的,哈哈! 🙂

在把侧边栏加宽的之后,发现侧边栏的分类和友情链接列表太窄了,非常不协调,于是乎就把它改成两栏,代码如下:


#subcontent ul.categories li{
    list-style-image:url(images/categories.gif);
    width:100px;
    float:left;
    margin:2px 0 2px 18px;
}

但是发现在 IE7 中,List-type-image 的图片不会显示出来,于是 Google 之,发现在 IE 中,float 和list-style-image 不兼容,建议使用 background-image 来代替,修改之后的代码如下:


#subcontent ul.categories li{
    background:url(images/categories.gif.gif) no-repeat center left;
    list-style:none;
    width:100px;
    float:left;
    margin:2px 0 2px 0;
    padding-left:18px;
}

热门文章