栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > C/C++/C#

jQuery移动页面开发中主题按钮的设计示例

C/C++/C# 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

jQuery移动页面开发中主题按钮的设计示例

在白色图标后的半透明的黑色圆圈确保了在任何背景色下图片都能够清晰显示,也使它能很好的工作在Jquery Mobile主题系统中。以下是一些在不同主题样式下图标按钮的例子

"A"主题下的图标按钮 data-theme="a"

 
 
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 
 
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 My button
 

"B"主题下的图标按钮 data-theme="b"

"C"主题下的图标按钮 data-theme="c"

主题按钮

Query移动具有丰富的主题系统,让您完全控制如何按钮风格。当链接添加到一个容器,它是自动分配符合其母棒或内容框的视觉整合按钮到父容器的主题样本的信,就像一条变色龙。所以一个按钮放在内容与主题为“一”(在默认主题黑色)将自动分配按钮的主题是“a”(在默认主题木炭)。a为黑,b为灰底蓝,c为灰底灰,d白底白色 ,e黄底黄色。这是默认的主题的主题对按钮的例子。所有的按钮都有相同的HTML标记:

 
 Swatch "a"Button
 Swatch "b"Button
 Swatch "c"Button
 Swatch "d"Button
 Swatch "e"Button

分配系统样式 data-theme

给按钮增加data-theme="字母"属性,可以手动的给按钮添加样式,使得按钮不一定非要与父容器的样式相符

 
 Swatch a
 Swatch b
 Swatch c
 Swatch d
 Swatch e

主题的变化 ui-body

默认有五套风格,ui-body-a,ui-body-b,ui-body-c,ui-body-d,ui-body-e


 Swatch a
 Swatch b
 Swatch c
 Swatch d
 Swatch e




 Swatch a
 Swatch b
 Swatch c
 Swatch d
 Swatch e

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/64708.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号