jquery手机导航栏图标大小 [英] jquery mobile navigation bar icon size

问题描述

我在导航栏中使用这段代码

I am using this piece of code for my nav bar

<a href="#home" data-icon="home" data-iconpos="top" class="ui-btn-active ui-state-persist">Home</a>

使用以下CSS

.ui-icon-home {
       background: url("home.png") no-repeat 50% 50% !important;      
}

此代码非常完美，取代了默认图标图片，但我不能在这里使用大图标。我想使用22 * 22像素的图标。当我尝试使用22 * 22像素图标jQuery Mobile封装图标在一个圆圈，因此只显示我的自定义图标的一些部分我想删除圈。

This code works perfectly and replaces default icon image but I cant use large icons here. I want to use 22 * 22 px icons. When I try to use 22 * 22 px icons jQuery Mobile encaps icons inside a circle and thus showing only some part of my custom icon I want to remove circle.

推荐答案

您可以使用以下css.This将覆盖图标类的默认值。

You can use the following css.This will override the default values for icon classes.

.ui-icon-home {
   background: url("home.png") no-repeat 50% 50% !important;      
   -moz-border-radius:0px;
   -webkit-border-radius:0px;
   border-radius:0px;
   width:22px;
   height:22px;
   margin-top:-12px;/*Adjust this value to position the icon*/
}

这篇关于jquery手机导航栏图标大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！