这是我对我的网站所需要的效果:

http://urban-walks.com/#nicer_way

不是花哨的一面-我有某些“节”或div的背景图片,我需要它们填充整个浏览器窗口。他们还需要在更改浏览器端(例如使用移动设备)时调整大小,以保持效果。

这是我当前每个div的代码-

HTML:

<div class="graph">
    <br><h1>Latest SKE Graph</h1>
    <img src="knowledge_graph.jpg">
</div>


CSS:

.graph {
background-image: url("pexels-photo-279366.jpeg");
background-size: cover;
background-position: center;
height: 700px;
text-align: center;
}

最佳答案

将高度更改为“ 100vh”,将宽度更改为“ 100vw”。 v代表设备的视口。

 .graph {
background-image: url("pexels-photo-279366.jpeg");
background-size: cover;
background-position: center;
height: 100vh;
width: 100vw;
text-align: center;


}

08-25 13:46
查看更多