0

我正在开发位于此处的移动应用程序。其中有一个名为“APP DOWNLOADS”的链接，只能在 ios 和 android 上看到。

现在，在我的 iPad 上查看此页面时，应用程序图像看起来不错，但在我的 Galaxy s3 上查看此页面时，应用程序图像看起来不太好。这一切都是弹性和薄的。

该页面通过以下代码显示图像：

<img src="<?php echo $article['app_img']; ?>" class="appimg" border="0" border="0" align="left"
.appimg {border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
    width:150px;    
    height:150px;
    position:relative; 
    background-color: transparent; }

但是浏览器显然显示不同。

有人可以为我提供解决方案吗？

此处提供的屏幕截图：

iPad iPhone 安卓

以上所有 3 个查看相同的代码，但在 android 上分别显示图像。

请帮忙谢谢。

4

2 回答 2

0

即使我在 xclo.mobi 上也遇到过同样的问题。

然后我使站点动态，我的 css 是基于当前设备的动态的。

所以尝试获取当前设备并相应地在客户端浏览器上加载 css 内容。

逻辑：如果当前设备 == ipad load css {width:150px}

这是因为浏览器和设备的分辨率。

我希望下面的代码能帮助你更多。

 <?php


/* detect mobile device*/
$ismobile = 0;
$container = $_SERVER['HTTP_USER_AGENT'];

// A list of mobile devices change as you wish
$useragents = array ( 

'Blazer' ,
'Palm' ,
'Handspring' ,
'Nokia' ,
'Kyocera',
'Samsung' ,
'Motorola' ,
'Smartphone', 
'Windows CE' ,
'Blackberry' ,
'WAP' ,
'SonyEricsson',
'PlayStation Portable', 
'LG', 
'MMP',
'OPWV',
'Symbian',
'EPOC',

); 

foreach ( $useragents as $useragents ) { 
if(strstr($container,$useragents)) {
$ismobile = 1;
} 
}
//And then you can load your css 
//eg:==
if($ismobile=1)
echo '.appimg{width:250px;height:250px}';//Change for device as you want
//After your php statements you can load your site content as usual

希望这对你有帮助

于 2013-09-05T15:25:31.943 回答
0

使用此代码对其进行排序

.appimg {
border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
    width:150px;    
    height:150px;
    position:relative; 
    background-color: transparent;
}

@media only screen and (-webkit-device-pixel-ratio:.75){
.appimg { 
 border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px; 
    width:150px;    
    height:350px;
    position:relative;
    background-color: transparent;
}
}

请 1up 谢谢。

于 2013-09-06T07:13:05.747 回答