CSS中的全屏响应式背景图片
我想将此图像作为网页的背景图像。但是，问题是图像不能覆盖整个页面，正如您在此预览中可能看到的那样，并且图像在最右端被重复。有没有一种方法可以使图像覆盖整个页面（可以是任何方式，拉伸，调整大小或新的方式）。
我的代码：
<!DOCTYPE HTML>
<html>
<head>
<title>Angry Birds Star Wars</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<style>
body {
background: url('http://www.androidtapp.com/wp-content/uploads/2012/11/Angry-Birds-Star-Wars-Menu.png');
}
</style>
</head>
<body></body>
</html>
谢谢。
更新：
我现在终于相信，几乎没有什么可以使该图像完全适合我的PC屏幕的。我现在还可以，并且可以继续前进，请不要发布答案。
鸿蒙传说浏览 1307回答 3
3回答
-
慕村225694
background: url(image.jpg) fixed 50%;background-size: cover; /* PS: Use separately here cause of Safari bug */的fixed（背景附件）是可选的。以上只是以下内容的简写：background-image : url(image.jpg);background-attachment : fixed;background-position : 50% 50%; /* or: center center */background-size : cover; /* CSS3 */您可以在所有现代浏览器中使用，但Safari可以使用：background: url(image.jpg) fixed 50% / cover;其中/在后台速记用于分离和区分position从size（原因位置接受单个和多个（X，Y）的值），但野生具有与该一个错误/速记所以使用如上所述。 -
大话西游666
background-size: 100% 100%;background-position: top left;background-repeat: no-repeat;应该可以。注意-您可以组合位置并重复到初始背景属性中并申请html, body { min-height: 100%; min-width: 100%; }
随时随地看视频慕课网APP
Html/CSS