无法在 IE 8 中显示数据库中的图片

Question

使用IE 8浏览我的显示购物车列表和图片的页面时，无法显示图片（.jpeg）和阴影效果。但其他浏览器工作正常..

这些图片是从相册中获取的缩略图，通过url链接，

下面是我的CSS。

body {
font-family:Helvetica-light;
font-size:14px;
padding:0;
margin:0;}

h1 {
    font-weight:normal;
    margin:0 0 10px 0;
}

h2, h3, h4, h5, h6 {
    font-weight:normal;
}

a {
    text-decoration:none;
    color:#777;
    display:block;
    margin:0 0 10px 0;
}

a:hover {
    text-decoration:underline;
}

:focus {outline:none;}

label { display:block; margin:0 0 5px 0;}

input {
    display:block;
    margin:0 0 5px 0;
}

input[type=submit] {
    cursor:pointer;
}

table {
    width:100%;
    box-shadow:0 0 5px #CCC;
    -webkit-box-shadow:0 0 5px #CCC;
    -moz-box-shadow:0 0 5px #CCC;
    -o-box-shadow:0 0 5px #CCC;
    behavior: url(ie-css3.htc);
    margin:0 0 10px 0;
}

table tr th {
    text-align:left;
    font-weight:bold;
    padding:10px;
    background:#F9F9F9;
}

table tr td {
    padding:10px;
}

table tr.empty td {
    background:#F9F9F9;
}


.clear { clear:both;}
.bold { font-weight:bold;}

#container {
    width:960px;
    margin:0 auto;
    padding:20px;
    box-shadow:0 0 10px #CCC;
    -webkit-box-shadow:0 0 10px #CCC;
    -moz-box-shadow:0 0 10px #CCC;
    -o-box-shadow:0 0 10px #CCC;
    behavior: url(ie-css3.htc);
}

.notify {
    padding:10px;
    background:#E9E9E9;
    margin:0 0 10px 0;
}

.product {
    float:left;
    margin:0 10px 0 0;
    box-shadow:0 0 10px #CCC;
    -webkit-box-shadow:0 0 5px #CCC;
    -moz-box-shadow:0 0 5px #CCC;
    -o-box-shadow:0 0 5px #CCC;
    behavior: url(ie-css3.htc);
}

.url{

    behavior: url(ie-css3.htc);
}
    .product .info { 
    float:left;
    padding:10px;}

    .product h3 { 
        margin:0 0 5px 0;
        background:#F9F9F9;
        padding:10px;
    }

Answer 1

behavior: url(ie-css3.htc); 不使用与 background-image: url(); 相同的路径结构，

这不会在您的 CSS 目录中查找位于您网站的文档根目录中。确保可以从 http://yourwebsite.com/ie-css3.htc 访问此文件

另外，我会更改 box-shadow CSS 声明的顺序，如下所示：

-webkit-box-shadow:0 0 10px #CCC;
-moz-box-shadow:0 0 10px #CCC;
-o-box-shadow:0 0 10px #CCC;
box-shadow:0 0 10px #CCC; /* This was moved to the bottom */

由于 CSS“级联”，支持 box-shadow 但保留 -webkit-box-shadow 的浏览器出于遗留原因，代码>周围将使用代码布局方式不标准 -webkit-box-shadow 。通过将 box-shadow 移至底部，我们确保支持该标准的浏览器将使用它。