好吧，已经学了jQueryMobile一年了，今天心血来潮，想要写一篇关于jQueryMobile的博客文章，记得去年暑假在公司实习jQueryMobile，想一想真是怀念当时还是菜鸟的自己，年轻就是任性呀（笑~），好了，关于jQueryMobile方面的概念知识，大家可以去网上查阅相关资料，今天我写了一些jQueryMobile的按钮样式，还是比较漂亮的，代码如下：

<!DOCTYPE html>

<html>

<head lang="en">

    <meta http-equiv="content-type" content="text/html;charset=utf-8" />

    <meta name="viewport" content="width=device-width,initial-scale=1">

    <link rel="stylesheet" type="text/css" href="css/jquery.mobile.flatui.css" />

    <script src="js/jquery.js"></script>

    <script src="js/jquery.mobile-1.4.0-rc.1.js"></script>

    <title>Flat</title>

</head>

<body>

    <div data-role="page">

        <div data-role="header" data-theme="f">

            <h1>DOTA资料大全</h1>

        </div>

        <div data-role="content">

            <a href="#" data-theme="a" data-icon="flat-settings" data-role="button">英雄简介</a>

            <a href="#" data-theme="b" data-icon="flat-new" data-role="button">物品资料</a>

            <a href="#" data-theme="c" data-icon="flat-man" data-role="button">经典出装</a>

            <a href="#" data-theme="d" data-icon="flat-mail" data-role="button">野怪资料</a>

            <a href="#" data-theme="e" data-icon="flat-bubble" data-role="button">教学视频</a>

            <a href="#" data-theme="f" data-icon="flat-menu" data-role="button">经典解说</a>

            <a href="#" data-theme="g" data-icon="flat-heart" data-role="button">明星专访</a>

            <a href="#" data-theme="g" data-icon="flat-time" data-role="button">关于作者</a>

        </div>

    </div>

</body>

</html>

网页效果如下图：

jQueryMobile的按钮样式的更多相关文章

  1. 纯CSS打造好看的按钮样式

    好看的按钮.链接.div样式,效果预览: http://hovertree.com/code/run/css/s8o19792.html 发现今天积分和排名不错: 代码如下: <!DOCTYPE ...

  2. 漂亮的CSS按钮样式集以及在线生成工具

    以前我们制作一样带带阴影.圆角或3D感的按钮都需要用图片来制作,但CSS3出来后就可以不用图片了,由于是代码写的按钮样式,在Retina上浏览依然清晰美观.虽然不错,但我们写一个阴影+质感的按钮还是挺 ...

  3. Expression Blend4经验分享：制作一个简单的文字按钮样式

    首先在Grid里放一个TextBlock,对象时间线窗口的结构树如下 右键点击grid,选择构成控件 会弹出构成控件的对话框,选择你要构成的控件类型,控件名称,控件样式存储位置 这里我们选择butto ...

  4. WinForm------TreeList修改节点图标和按钮样式

    转载: https://documentation.devexpress.com/#WindowsForms/DevExpressXtraTreeListTreeList_CustomDrawNode ...

  5. [k]自定义上传文件按钮样式

    <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title> ...

  6. [BS-10] 统一设置app所有页面的“返回”按钮样式

    统一设置app所有页面的“返回”按钮样式 如果想统一设置app所有页面的“返回”按钮样式,首先自定义WZNavigationController类继承UINavigationController类,然 ...

  7. css 滑动按钮样式

    <div class="pub_switch_box"> <input type="checkbox" id="pub_switch ...

  8. 上传按钮样式优化 <input type="file" />

    <html><head><title>上传按钮样式优化</title> <style>.form-element-file-wapper { ...

  9. uploadify 自定义按钮样式

    uploadify是一款不错的JQUERY上传插件,但是FLASH按钮的外挂往往跟我们网页的设计不太搭配.一开始我还试图反编译uploadify.swf来修改其外观,结果发现反编译为FLA后里面没有任 ...

随机推荐

  1. 【代码笔记】iOS-NSTimer

    代码: RootViewController.h #import <UIKit/UIKit.h> @interface RootViewController : UIViewControl ...

  2. SQL SERVER 将表字段值0和1互转的几种方法

    需求: 如果表字段的值为 0 则将其修改为1 ,如果表字段的值为 1 则将其修改为 0. 方法一 end 方法二 ) 方法三 )

  3. JSTL 标签大全详解

    (尊重劳动成果,转载请注明出处:http://blog.csdn.net/qq_25827845/article/details/53311722  冷血之心的博客) 一.JSTL标签介绍 1.什么是 ...

  4. Python 基于Python实现邮件发送

    基于Python实现邮件发送   by:授客 QQ:1033553122 测试环境: Python版本:Python 2.7   注:需要修改mimetypes.py文件(该文件可通过文章底部的网盘分 ...

  5. WOSA/XFS PTR Form解析库—xfsptrdata.h

    #ifndef _XFSPTRDATA_H_#define _XFSPTRDATA_H_ #include <XFSPTR.H>#include <Windows.h>#inc ...

  6. SpringBoot中redis的使用介绍

    REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统. Redis是一个开源的使用ANSI C语言编写.遵守B ...

  7. python websocket client 使用

    import websocket ws = websocket.WebSocket() ws.connect("xx.xx.xx") ws.send("string&qu ...

  8. python自学——文件修改

    #如何修改文件,我们知道文件因为在磁盘上已经有储存了,后面要更新或修改,只能在在原来文件后面追加使用f=open("wenjian_name","r+",enc ...

  9. 《SQL Server 2008从入门到精通》--20180724

    目录 1.事务 1.1.事务的ACID属性 1.2.事务分类 1.2.1.系统提供的事务 1.2.2.用户自定义的事务 1.3.管理事务 1.3.1.SAVE TRANSACTION 1.3.2.@@ ...

  10. PowerShell发送邮件（587）

    #定义邮件服务器 $smtpServer = "mail.xx.com" $smtpUser = "sender" $smtpPassword = " ...