图像不会根据显示器显示移动

时间:2014-07-19 01:13:46

标签: javascript html css

我的网站图像定位出现问题。 我已将其设置为与背景和显示器尺寸相关的正确位置。但是我今天在screenfly上测试了它的结果是不同的。我的目标是让图像自动在屏幕上移动,以满足更大显示器的需要(如果需要)。 总而言之,我所追求的是一些代码,可以让我的图像自动重新定位更大的显示。 网站网址为www.mustownit.com

我以前在更大的展示广告上看到我的网站的网站是Screen Fly

    <!doctype html>
<html>
<head>
  {{content_for_header}} 
<meta charset="utf-8">
<title>Untitled Document</title>

<style type="text/css">
body {
    background-image: url(https://cdn.shopify.com/s/files/1/0519/8985/files/dK8eAz1.jpg?6056);
    background-repeat: repeat;
}
</style>
</head>

<body>
  {{content_for_body}} 
  {{content_for_layout}} 
<div style="position:absolute"></div>
<span style="position: absolute; left: 243px; top: 161px;"><img src="https://cdn.shopify.com/s/files/1/0519/8985/files/theinternetschoice.png?6056" width="614" height="76" alt=""/></span>

<div style="position:absolute"></div>
<span style="position: absolute; left: 112px; top: 14px;"><img src="https://cdn.shopify.com/s/files/1/0519/8985/files/xuWE8Qe.png?6056" width="884" height="129" alt=""/></span>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

我真的不明白你的意思, 但我有解决方案可能是你需要的。 将此代码添加到CSS并尝试

background-size : cover

您的代码将是:

<style type="text/css">
body {
    background-image: url(https://cdn.shopify.com/s/files/1/0519/8985/files/dK8eAz1.jpg?6056);
    background-repeat: repeat;
    background-size : cover ;
}
</style>

如果那不是您需要的,请给我更多解释。 祝你有个美好的一天。