5

这是我的 CSS 和 HTML 代码。我想将单个图像放在中心，除了图像周围有一个奇怪的白色边框外，这很有效。我已经尝试border:none;过border:0;

HTML：

<!DOCTYPE html>
<html>

<head>
<title>Food.</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="icon" type="image/png" href="favicon.ico">

</head>


<body>
<img border="0" id="image" class="centered" />

</body>

</html>

CSS：

.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -182px;
  margin-left: -153px;

}

img#image{
   /*I think this is where the issue is caused*/
    width:337px;
    height:219px;
    background-image: url('soon_comp.png');
    background-color: transparent;
}


body {
    outline: none;
    background-color: rgb(15,15,30);
    border-color:transparent;
    border:0px;
}
4

2 回答 2

9

我不知道您为什么要为 img 标签设置背景图片，我宁愿使用 div 或 span 标签。但是，如果您真的想这样做，请尝试添加到您的 img#image CSS 规则：

img#image{
  content: '';
  ...
}
于 2012-10-17T01:31:35.643 回答
0

我不知道您是否尝试简化代码，但是：

1）图片的src缺失：<img src= "myimage.jpg" />.

2）不要border="0"在CSS使用中使用border:none

3）不要给图像添加背景，也许可以使用分割。

除此之外，当我测试您的代码时，我没有看到任何白色边框。你能更具体一点吗？

于 2012-10-17T01:46:15.530 回答