Question

我想使用CSS设置一个内部带有图像的<div></div>，而不是使用background-image: url("bg.jpg");。我的图片<div></div>看起来像这样：

<div id="background">
  <img src="imgs/bg1.jpg" alt="" />
</div>

先谢谢你的帮助

Answer 1

很抱歉，但你的问题很悖论。

使用background-image: url(bg.jpg)是CSS和方法。您可以在div上的style属性中使用该CSS规则，如下所示：

<div id="background" style="background-image: url(bg.jpg);"></div>

或者您可以将规则放在HTML页面头部的样式块中，如下所示：

<head>
....
<style type="text/css">
#background {
    background-image: url(bg.jpg);
}
</style>
</head>
<body>
....

或者您可以将其放在页面中包含的CSS文件中。

在任何一种情况下，我建议您查阅一本关于HTML和CSS的好书。这样您还可以了解何时使用哪种方法。

Answer 2

我设法解决了，这是代码
HTML：

<div id="bg">
  <img src="style/imgs/bg1.jpg" alt="">
</div>

CSS：

#bg {
  position: fixed; 
  top: -50%; 
  left: -50%; 
  width: 100%; 
  height: 100%;
}

#bg img {
  position: absolute; 
  top: 0; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  margin: auto; 
  min-width: 90%;
  min-height: 90%;
}

将div设置为背景图像

2 个答案: