jquery - 如何让所有图像全屏？

Question

如果有一种方法可以让所有图像全屏显示。

唯一随浏览器调整大小的图像是背景图像。其余图像是将鼠标悬停在列表项上时淡入淡出的图像。

body {
background: black;
width:100%;
height: 100%;
padding:0px;
margin:0px;
}
ul {
list-style:none;
background-color:#00F
}
div {
position:absolute;
z-index:0;
top:0;
left:0;
padding:0px;
margin:0px;
width:100%;
height:100%;
background: url(images/01.jpg);
}
container {
position:absolute;
z-index:1;
left:0;
right:0;
width:270px;
margin:0 0 0 10px;
}

<div id="content">
  <div id="div"></div>
  <div id="container">
    <ul>
      <li id="first">test</li>
      <li id="second">test</li>
      <li id="third">test</li>
    </ul>
  </div>
</div>

如果您将鼠标悬停在列表项上，淡入的图像也是需要调整大小的图像。用 jQuery 替换背景。

我希望有人能帮助我。

Answer 1

如果我很好理解你的问题，

添加到 CSS div 样式:

background-size: cover;

(或 background-size: contain; 取决于你想要什么)