相关疑难解决方法(0)

如何复制在iOS上修复的后台附件

我正在尝试在iOS上为学校项目提供固定背景图像div.我一直在用

background-attachment: fixed;
Run Code Online (Sandbox Code Playgroud)

但这导致了移动游猎中的奇怪尺寸和滚动效果.这是我正在使用的网站 ; 我目前用于引用div图像背景的方法在桌面上运行良好但在iOS上完全失败.

不知何故,http: //www.everyonedeservesgreatdesign.com 得到了这个工作.我在跟踪代码时遇到了困难,因为他们正在使用某种类型的方形空间模板,但看起来他们正在将图像放入一个position:fixed以某种方式被position:relative其父div 剪切的div中.我的印象是不可能position:fixed用视口以外的任何东西来剪切div,所以我很好奇这里发生了什么.

关于如何在我的网站中为固定图像div背景实现此方法的任何想法?

html css ios

74
推荐指数
1
解决办法
16万
查看次数

使用ios7修复了背景图像

我有一个项目,我正在使用固定的背景图像.它适用于除ios7之外的所有功能.在ipad上,背景图像被放大并且模糊.这是我正在使用的CSS代码 -

.header {
  display: table;
  height: 100%;
  width: 100%;
  position: relative;
  color: #fff;
  background: url(../images/boston2.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  }
Run Code Online (Sandbox Code Playgroud)

这是实时页面的链接 - www.wdeanmedical.com

我错过了什么?

css background cover ios7

38
推荐指数
7
解决办法
8万
查看次数

背景:修复不重复不在手机上工作

我正在构建一个网页,我希望背景图像可以缩放以适应整个屏幕,保持纵横比并固定(因此,如果向下滚动,背景图像将保持在同一位置).

我已经在桌面浏览器中使用下面的CSS实现了这一点,但它无法在iPhone或iPad上运行.在这些设备上,背景太大(它继续在折叠下方),如果向下滚动得足够远,图像将开始重复.任何人都有修复?谢谢!

HTML {
  background: url(photos/2452.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
Run Code Online (Sandbox Code Playgroud)

html css safari mobile ios

31
推荐指数
3
解决办法
8万
查看次数

Android/Mobile Webkit CSS背景 - 附件:修复不起作用?

我只是疯了,或背景附件:固定; 真的不适用于原生Android浏览器?

我已经通过使用两个div而不是一个来实现一个简单的修复...第一个div绝对定位并包含固定的背景图像,另一个div位于它之上并包含滚动内容.

这个修复的问题(除了不必要的复杂化)是由于某种原因,当我在背景图像div上滚动内容时,背景图像完全消失!:(

有没有其他人找到一个没有错误的解决方法,或者我们应该如何使用它?

css mobile android webkit mobile-webkit

7
推荐指数
1
解决办法
2万
查看次数

CSS - 背景图像无法在移动浏览器上正常显示

我正在处理的网站(http://tinyurl.com/ax68brt)的背景图片无法在手机浏览器上正常显示.outheader,outbeurzen和outtwitter div出现问题.标题背景不以100%宽度显示,并且outbeurzen/outtwitter div的背景也未正确显示.

这里出了什么问题?

HTML:

<div id="outheader"></div>
<div id="outintro"></div>
<div id="outbeurzen"></div>
<div id="outfoto"></div>
<div id="outtwitter"></div>
<div id="outfooter"></div>
Run Code Online (Sandbox Code Playgroud)

CSS:

#outheader {
background-image: url(images/achtergrond/header.jpg);
float: left;
height: 660px;
width: 100%;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: 50% 0px;
margin: 0px;
padding: 0px;}

    #outintro {
background-image: url(images/achtergrond/body.jpg);
float: left;
height: auto;
width: 100%;
background-attachment: fixed;
background-repeat: repeat-y;
background-position: 50%;
padding-top: 60px;
padding-bottom: 60px;
    }

    #outbeurzen {
background-image: url(images/achtergrond/beurzen.jpg);
float: left;
height: 315px;
width: 100%;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: 50% -300px;
    } …
Run Code Online (Sandbox Code Playgroud)

css browser mobile background image

1
推荐指数
1
解决办法
3万
查看次数

标签 统计

css ×5

mobile ×3

background ×2

html ×2

ios ×2

android ×1

browser ×1

cover ×1

image ×1

ios7 ×1

mobile-webkit ×1

safari ×1

webkit ×1