好吧，已经学了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. 退役前的最后的做题记录upd:2019.04.04

    考试考到自闭,每天被吊打. 还有几天可能就要AFO了呢... Luogu3602:Koishi Loves Segments 从左向右,每次删除右端点最大的即可. [HEOI2014]南园满地堆轻絮 ...

  2. require.js的基本概念及使用流程（1）

    今天,我们来说一说requireJS的基本概念,在下一篇随笔中我们再去讨论讨论requireJS的使用步骤 这一篇都是一些概念性比较强的东西,希望大家擦亮自己的钛合金狗眼好好看看概念,好吧 首先,什么 ...

  3. webpack中mainifest.js vendor.js app.js 三者的区别

    场景: 大家在利用构建工具进行应用最后的打包过程中,我们希望做到的是将业务代码和第三方引用模块代码分开打包. 因为第三方引用模块代码通常很大,而且在不引入新的模块之前基本上是不会变动的.所以我们需要将 ...

  4. nmon 及nmon analyser工具使用简介

    nmon及nmon analyser工具使用简介 by:授客 QQ:1033553122 下载地址 http://nmon.sourceforge.net/pmwiki.php?n=Site.Down ...

  5. MySql 利用crontab实现MySql定时任务

    MySql 利用crontab实现MySql定时任务 by:授客 QQ:1033553122 适用平台 任意myslq版本数据库 操作方法 登陆到数据库系统所在的linxu系统 第一步:新建名为cro ...

  6. matlab练习程序（异或分类）

    clear all; close all; clc; %生成两组已标记数据 randn(); mu1=[ ]; S1=[; 0.5]; P1=mvnrnd(mu1,S1,); mu2=[ ]; S2= ...

  7. sql Server 查询方法的优化

    在使用SQL语句查询数据库记录时,如果要查询相同的内容,有着不同的多种方法. 仍然,尽管使用多种方法可以得到相同的结果,但是,如果您使用不同的方法,在执行效益上是截然不同的.因此,我们得仔细考虑,如果 ...

  8. AD域创建用户无法登录

    怎么登录都无法登录 解决办法: 创建用户的时候   将用户下次登录时须更改密码的勾去掉    不然需要修改密码才可以登录

  9. linux内核完全剖析——基于0.12内核-笔记（1）-CPU 数据通信

    CPU数据通信总线 CPU通过地址线.数据线.控制信号组成的本地总线(或称为内部总线)与系统其它部分进行数据通信. 地址总线 地址总线用于内存或I/O设备的地址,即指明需要读/写数据的具体位置. 数据 ...

  10. linux stat 简单介绍

    stat 命令查看文件或文件系统的状态时间等属性 用法:stat [参数]... 文件... 简单的介绍一下stat命令显示出来的文件其他信息: - File:显示文件名 - Size:显示文件大小 ...