我有一个可在平板电脑和手机上运行的android应用。我的内容是从资产文件夹加载html文件。我的问题是我想在平板电脑和手机上使用不同的图像尺寸。
这是手机上图像的代码。
<img src="check_yes_tick_parent.png" width="8%"/>
但是,这在平板电脑上太大了,理想情况下,我希望宽度为3%。
我知道我可以为每个制作两个html文件。即,一个用于手机,一个用于平板电脑。但是,有没有更简单的方法?
您可以为此使用css和媒体查询,然后就不需要2个或多个html文件了。
例如:
在html上:
<div id="image"></div>
在CSS:
@media screen and (min-width: 1024px) {
width: 100px;
height: 100px;
background-image: url(check_yes_tick_parent.png);
}
@media screen and (width: 768px) and (height: 1004px) {
width: 50px;
height: 50px;
background-image: url(check_yes_tick_parent_for_pad.png);
}
您可以参考CSS3 @media Rule
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句