我有一些按钮在Chrome浏览器中显示正常,但在现有的Android浏览器上,图像看起来比它们小。
HTML
<div class="col-postSocial">
<ul>
<li><a class="fb" href="http://www.facebook.com/share.php?u=<?php the_permalink(); ?>"></a>
</li>
<li><a class="twit" href="http://twitter.com/share?url=<?php the_permalink(); ?>" target="_blank"></a>
</li>
<li><a class="ggl" href="https://plus.google.com/share?url=<?php the_permalink(); ?>"></a>
</li>
<li><a class="pin" href="http://pinterest.com/pin/create/link/?url=<?php the_permalink(); ?>" target="_blank"></a>
</li>
</ul>
</div>
CSS
.col-postSocial {
width:100%;
margin-top:20px;
margin-bottom:10px;
text-align:center;
float:none;
}
.col-postSocial li {
display:inline-block;
}
.col-postSocial a {
display:block;
height:50px;
width:50px;
}
.fb {
background:url('../images/facebook.png') #3b5998;
}
.twit {
background:url('../images/twitter.png') no-repeat top #00aced;
}
.ggl { background:url('../images/google_plus.png') no-repeat top #dd4b39;
}
.pin {
background:url('../images/pinterest.png') no-repeat top #cb2027;
}
我不确定要在androids stock浏览器上做什么改变,肯定这应该可行吗?
图像是50 x 100px png,但在Android上,图像看起来更像是25 x 50px,盒子仍然是50x50所以造成这种情况的原因是什么?
答案 0 :(得分:0)
啊,它只是想让我定义一个大小background-size:50px 100px!important;