图像不随显示器显示而移动
Images don't move according to monitor display
我的网站图像定位有问题。我已经把它设置在与背景和显示器尺寸相关的正确位置。然而,我今天在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>
如果这不是你需要的,请给我更多的解释。祝你过得愉快。
相关文章:
- 如何在悬停时显示文本而不移动页面上的内容
- 以下数据布局在设置显示上向上移动:无
- 在移动浏览器上显示大型文本文件
- IE(移动设备)在触摸时不显示子项
- 如何移动PIXI显示对象
- 当我将子项从一个父项移动/复制到另一个父级时,如何重新计算显示
- 将页面内容向左移动时显示/隐藏右侧面板
- 尝试在画布中对形状进行动画处理时,它会显示,但不移动
- jQuery移动显示页面5秒钟,然后重定向
- Google Maps Javascript API v3 地图显示在桌面浏览器上,但不会显示在移动浏览器上
- 显示移动窗口时引导导航栏中的 atach 搜索栏
- iPhone锚点,scrollTop,scrollTo显示移动按钮栏,但不会滚动或跳到锚点
- 删除的DOM元素仍然显示在移动safari(iOS 5.1)中
- 为什么 Jquery 移动显示移动友好在桌面浏览器上看起来很友好
- 在 JS 中重置 HTML 范围输入不会移动显示的滑块
- Dojo移动显示滚动条
- jQuery移动显示双按钮
- 使用jquery移动显示地图位置,使用经度和纬度
- JQuery移动显示空白
- 自动高度虚拟列表为移动显示大列表