好吧，已经学了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. HTML meta 标签总结

    本文转载自:http://www.cnblogs.com/lovesong/p/5745893.html meta标签作用 META标签是HTML标记HEAD区的一个关键标签,提供文档字符集.使用语言 ...

  2. 如何迁移 ArcGIS Enterprise WebGIS（ Portal Server DataStore ）系统

    在部署ArcGIS Enterprise WebGIS系统的时候,往往由于后期系统的扩容需求,需要把已经部署好的组件迁移到其他服务器中. ArcGIS WebGIS系统涉及的软件组件有Portal S ...

  3. MySQL——优化ORDER BY语句

    本篇文章我们将了解ORDER BY语句的优化,在此之前,你需要对索引有基本的了解,不了解的朋友们可以先看一下我之前写过的索引相关文章.现在让我们开始吧. MySQL中的两种排序方式 1.通过有序索引顺 ...

  4. 无线网卡加密方式wep wpa/wpa2 介绍

    常见无线热点的配置选项:无线名称路由器的无线(Wi-Fi)名称.无线密码无线加密使用WPA2-PSK/WPA-PSK加密方式.AES加密算法,无线密码为8-63个字符,最好是数字.字母.符号的组合.信 ...

  5. 学习笔记：Analyze MySQL Performance及慢日志的开启

    Table of Contents Analyze MySQL PerformanceTuningSlow queries and Slowlog Brought to you by Rick Jam ...

  6. [Python_6] Python 配置 MySQL 访问

    0. 说明 Python 访问 MySQL 数据库,需要安装 MySQL 的 Python 插件. 1. 安装 MySQL 插件 pip install PyMySQL 2. 编写代码 # -*-co ...

  7. Rancher 添加主机无法显示、添加主机无效的解决办法

    在 Rancher UI 中,添加主机,在 Shell ssh 运行了,然后 点击 “关闭” 按钮,发现没有显示如何主机. 第一步,先去查看应用是否正常,就是 应用 - 全部应用 如果显示是 unhe ...

  8. burpsuite联合sqlmap扫描注入点

    其实我们在众测的时候完全可以使用burpsuite联合sqlmap测试目标的注入漏洞.对get和post型注入都支持. 先来记录proxy的log , 记住路径     把proxy拦截关掉 接下来浏 ...

  9. Python接口自动化--requests 1

    # _*_ encoding:utf-8 _*_ import requests #请求博客园首页,无参数的get请求 r = requests.get('http://www.cnblogs.com ...

  10. 封装Ajax框架！（代码篇）

    写在前面的话,如果中间有什么不明白的,请先看封装ajax框架!(前言篇) 1.添写一个封闭函数 (function(){})(); 在一个项目中,可能会引用多个js框架,如果函数名相同,会有命名冲突, ...