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

时间:2011-08-16 04:16:47

标签: css cross-browser jpeg

使用IE 8浏览我的显示器列表和图片的页面时,无法显示图片(.jpeg)和阴影效果。但其他浏览器很好..

图片是从相册中获取的缩略图,由网址链接,

以下是我的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;
    }

1 个答案:

答案 0 :(得分:0)

behavior: url(ie-css3.htc);不使用与background-image: url();

相同的路径结构

这不会查看CSS所在的目录,而是查看您网站的docroot。请确保可以从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移到底部,我们确保支持该标准的浏览器将使用它。