jquerymobile知识点:实现toolbar下方显示,自定义图标!

css:

.nav-glyphish-example .ui-btn .ui-btn-inner { padding-top: 40px !important; }
.nav-glyphish-example .ui-btn .ui-icon { width: 30px!important; height: 30px!important; margin-left: -15px !important; box-shadow: none!important; -moz-box-shadow: none!important; -webkit-box-shadow: none!important; -webkit-border-radius: none !important; border-radius: none !important; }
#chat .ui-icon { background:  url(images/ico_message_enter.png) 50% 50% no-repeat; background-size: 24px 22px; }
#email .ui-icon { background:  url(images/ico_business_enter.png) 50% 50% no-repeat; background-size: 24px 16px;  }
#login .ui-icon { background:  url(images/ico_order_enter.png) 50% 50% no-repeat;  background-size: 12px 26px; }
#beer .ui-icon { background:  url(images/ico_balance_enter.png) 50% 50% no-repeat;  background-size: 22px 27px; }
#coffee .ui-icon { background:  url(images/ico_recharge_enter.png) 50% 50% no-repeat;  background-size: 20px 24px; }
#skull .ui-icon { background:  url(images/21-skull.png) 50% 50% no-repeat;  background-size: 22px 24px; }

html:

<div data-role="footer" class="nav-glyphish-example" data-position="fixed">
  <div data-role="navbar" class="nav-glyphish-example" data-grid="d">
    <ul>
      <li><a href="baseInfo.html" id="chat" data-ajax="false" data-theme="e" data-icon="custom" data-id="baseInfo" class="next_btn" data-transition="slide">基本信息</a></li>
      <li><a href="yewuCheck.html" data-ajax="false" id="email" data-theme="e" data-icon="custom" data-id="yewuCheck" data-transition="slide">业务查询</a></li>
      <li><a href="yewuOrder.html" data-ajax="false" id="login" data-theme="e" data-icon="custom" data-id="yewuOrder" data-transition="slide">业务订购</a></li>
      <li><a href="yueCheck.html" data-ajax="false" id="beer" data-theme="e" data-icon="custom" data-id="yueCheck" data-transition="slide">余额查询</a></li>
      <li><a href="zhuanZhang.html" data-ajax="false" id="coffee" data-theme="e" data-icon="custom" data-id="zhuanZhang" data-transition="slide">转账充值</a></li>
   </ul>
  </div>
</div>

时间: 2024-08-09 02:05:01

jquerymobile知识点:实现toolbar下方显示,自定义图标!的相关文章

Android ToolBar自定义图标,关联DrawerLayout

Android5.0出现了一个可以代替ActionBar的控件ToolBar,使用更加灵活,一般我们使用ToolBar来和DrawerLayout配合使用,官方提供了一个开关类ActionBarDrawerToggle,来实现ToolBar和DrawerLayout的关联,但是 有时根据我们的需求需要更改左侧的图标,不在需要系统默认的三条杠的图标同时点击图标还想要DrawerLayout的侧拉页面出来,下面讲解两种不同的方式 一:通过代码来实现改变ToolBar的图标 public class

在Eclipse中JFrame自定义图标可以显示,但是导出JAR之后无法显示

在我的项目中,一开始我使用这种方式构造图片路径,然后将其设置到JFrame中即可以显示自定义图标 String imagePath = System.getProperty("user.dir") + "/image/icon.png";// 构造图片的路径 Image imageIcon = Toolkit.getDefaultToolkit().getImage(imagePath); jFrame.setIconImage(imageIcon); 项目路径如下

ionic2中使用自定义图标

在ionic2中使用自定义图标,如iconfont(阿里巴巴矢量图标). 先在http://www.iconfont.cn/ 中找到自己需要的图标,然后将图标加入购物车,然后下载该图标. 下载完成后解压,打开文件demo_unicode.html可以看到它提供的使用方法,我们在ionic2中按照以下方法使用: 1.在项目的assets目录下新建fonts文件夹,然后将下载解压后的iconfont.woff.iconfont.ttf.iconfont.svg.iconfont.eot添加到font

JSP等网站【创建带自定义图标的桌面快捷方式】

原理解析:1.打开网页 2.打开网页的exe自定义图标 URL= "http://www.gaoxinshangcheng.com/" Call RunApp(URL) Call OnScriptExit() Sub OnScriptExit() Hwnd = Plugin.Window.Find(0, "桌面快捷方式Exe运行标题") Call Plugin.Window.Close(Hwnd) End Sub 有附件可用.

Unreal Engine 4 C++ 为编辑器中Actor创建自定义图标

有时候我们创建场景的时候,特定的Actor我们想给它一个特定的图标,便于观察.比如这样: 实现起来也很简单,需要编写C++代码: 我们创建一个Actor,叫AMyActor,它包含一个Sprite(精灵),这个精灵负责显示自定义图标:代码如下 #pragma once #include "GameFramework/Actor.h" #include "Components/BillboardComponent.h" #include "MyActor.g

ionic2 +Angular 使用自定义图标

结合阿里巴巴矢量图标库实现在ionic2开发中使用自定义图标. step1:在阿里巴巴图标管理中新建项目,并添加自己选中的图标到购物车: step2:将购物车中的图标"添加至项目": step3:打开"我的项目,选择图片进行编辑.根据项目需求.如果所有的图标名称前半部分都设置成统一的名称的话,只需要在图标编辑是填入后半部分名称. step4:步骤三中的统一名称可以在"更多操作"--"编辑项目"中设置. 我这边在项目中统一使用iOS模式

分别用ToolBar和自定义导航栏实现沉浸式状态栏

一.ToolBar 1.在build.gradle中添加依赖,例如: compile 'com.android.support:appcompat-v7:23.4.0' 2.去掉应用的ActionBar.可以是修改主题theme为"NoActionBar",例如: <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> 或者不修改主题为"NoAct

Delphi 7使用自定义图标关联文件类型

Delphi 7使用自定义图标关联文件类型

[DevExpress]treeList1背景色设置与自定义图标

为了和系统界面一致改成透明色: treeList1.BackColor = Color.Transparent; treeList1.Appearance.Empty.BackColor = Color.Transparent; treeList1.Appearance.Row.BackColor = Color.Transparent; 自定义图标 private void treeList1_CustomDrawNodeImages(object sender, CustomDrawNode

如何设置安装界面左上角的自定义图标

原文:如何设置安装界面左上角的自定义图标 上一篇:sqlserver显示数据库和表及列名 DialogSetInfo(DLG_INFO_ALTIMAGE,SUPPORTDIR^"logo.BMP",TRUE); logo.BMP要预先Import到Support File下 下一篇: 使用strtuts2的iterator标签循环输出二维数组 如何设置安装界面左上角的自定义图标