【问题标题】:Resize image when resizes window调整窗口大小时调整图像大小
【发布时间】:2017-08-16 00:39:44
【问题描述】:

大家!

我想我的问题很简单,但我不知道如何解决它:/

我想制作一个全高和全宽的图像,当我们调整窗口的宽度时,图像会正确调整大小,如下例所示: https://avada.theme-fusion.com/resume/

我已经尝试过调整宽度和高度,但我不能得到相同的结果

感谢您的帮助!

【问题讨论】:

  • 请附上您使用的html和css,以及您得到的结果,以便我们提供帮助

标签: html css sass less


【解决方案1】:

您要查找的属性是background-size: cover。

body{
  background-image: url('https://avada.theme-fusion.com/resume/wp-content/uploads/sites/66/2016/07/home_bg.jpg');
  background-size: cover;
  background-position: center;
}

您需要使用 css background-image 而不是 <img/> 来实现此结果。

这是一个演示:https://jsfiddle.net/7rqm0mtb/

【讨论】:

  • 是的,就是这样!谢谢你:)
【解决方案2】:

如果您可以发布您正在使用的代码以便更好地了解您的工作方式,那将是理想的选择。

您发布的 Avada 链接使用图像作为背景图像,背景大小属性设置为“封面”。看看this example on w3 schools。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2010-12-21
    • 2017-04-29
    • 2021-10-02
    • 2019-06-17
    • 1970-01-01
    • 2019-05-15
    • 1970-01-01
    相关资源
    最近更新 更多