为什么这个CSS不适用于Android上的Chrome,而适用于其他任何地方?
这真让我困惑。我希望pic.jpg在后台是静态的(滚动时不移动),并且不会拉伸 它适用于除Android上的Chrome之外的所有浏览器(如Chrome、Safari、Firefox)(甚至适用于Android原始浏览器)为什么这个CSS不适用于Android上的Chrome,而适用于其他任何地方?,android,css,ruby-on-rails-3,google-chrome,twitter-bootstrap,Android,Css,Ruby On Rails 3,Google Chrome,Twitter Bootstrap,这真让我困惑。我希望pic.jpg在后台是静态的(滚动时不移动),并且不会拉伸 它适用于除Android上的Chrome之外的所有浏览器(如Chrome、Safari、Firefox)(甚至适用于Android原始浏览器) 正文{ 背景色:透明!重要; 背景图片:url(); 背景位置:中心; 背景重复:无重复; 背景附件:固定; -webkit背景尺寸:封面; -moz背景尺寸:封面; -o-背景尺寸:封面; 背景尺寸:封面; } Chrome for Android将其显示为pic.jpg
正文{
背景色:透明!重要;
背景图片:url();
背景位置:中心;
背景重复:无重复;
背景附件:固定;
-webkit背景尺寸:封面;
-moz背景尺寸:封面;
-o-背景尺寸:封面;
背景尺寸:封面;
}
Chrome for Android将其显示为pic.jpg,显示在屏幕的中间位置,而不是整个页面,并且不会在滚动页面上保持静态
我无法在JSFIDLE上复制它,我也尝试用我的Android手机调试它,但似乎没有任何帮助
这不是创建背景图像的方法吗?我不想太残忍,但这个问题大约在4年前就有报道了 我想,最新的回应有助于: 在我用Android做的实验中,我注意到身体内所有其他DIV的行为都是正确的,包括居中,所以我将图像移动到另一个DIV,它就工作了 真有趣
最好的我找到了一个解决办法,可以在Chrome for Android上正确显示背景:在html标记中定义背景,而不是正文。以下是新的css:
html{
background-color: transparent !important;
background-image: url(<%= asset_path "pic.jpg" %>);
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
html{
背景色:透明!重要;
背景图片:url();
背景位置:中心;
背景重复:无重复;
背景附件:固定;
-webkit背景尺寸:封面;
-moz背景尺寸:封面;
-o-背景尺寸:封面;
背景尺寸:封面;
}
。根据我的经验,背景在其他浏览器中也能正常工作 我也有类似的问题。。我用这个来修复它
html{
height:100%;
min-height:100%;
}
body{
min-height:100%;
}
你能给我们这个页面的链接吗?还是最后类似的例子?更像是有用的。可惜已经4年了,android版chrome仍然不支持基本功能。。即使是苹果也支持这一点。即使是苹果,你让我开心了:-D仅供参考,最新的Magento管理员登录区在其他现代浏览器没有任何问题的情况下,也无法在chrome(linux/windows测试)上运行。我不得不承认chrome是我最喜欢的浏览器,但是一些bug开始提醒我IE6。设置
!重要的背景大小属性上的标志也适用于我。
html{
height:100%;
min-height:100%;
}
body{
min-height:100%;
}