slobodianiukvitali Asked:2020-02-07 01:18:05 +0000 UTC2020-02-07 01:18:05 +0000 UTC 2020-02-07 01:18:05 +0000 UTC 响应式背景图片? 772 如何为网站写出这样的背景(自适应) https://www.webfx.com/blog/images/assets/cdn.sixrevisions.com/0431-01_responsive_background_image_demo/responsive-full-background-image-demo.html css 1 个回答 Voted Best Answer adudnik.ru 2020-02-07T01:22:24Z2020-02-07T01:22:24Z 具体来自示例 - 如下所示: css body { background-image: url(https://www.webfx.com/blog/images/assets/cdn.sixrevisions.com/images/background-photo.jpg); background-position: center center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; background-color: #464646; } 而在移动版本中,只需加载一个较小的图像: @media only screen and (max-width: 767px){ body { background-image: url(images/background-photo-mobile-devices.jpg); } } 这里有详细的教程,点击示例中的“教程”按钮即可阅读。 https://www.webfx.com/blog/web-design/responsive-background-image/
具体来自示例 - 如下所示:
css
而在移动版本中,只需加载一个较小的图像:
这里有详细的教程,点击示例中的“教程”按钮即可阅读。
https://www.webfx.com/blog/web-design/responsive-background-image/