图像不随显示器显示而移动

Images don't move according to monitor display

本文关键字:移动 显示 显示器 图像      更新时间:2023-09-26

我的网站图像定位有问题。我已经把它设置在与背景和显示器尺寸相关的正确位置。然而,我今天在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>

我不太明白你的意思,但我有个办法,可能是你需要的。将这段代码添加到你的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>
如果这不是你需要的,请给我更多的解释。祝你过得愉快。