怎样在jquery mobile添加自定义样式

html-css015

怎样在jquery mobile添加自定义样式,第1张

方法一:修改一下Jquery mobile的css样式控制背景颜色的代码;

方法二:覆盖一下Jquery mobile的css样式控制背景颜色的代码,修改的代码在Jquery mobile样式引用之后就可以覆盖原来的样式了;

代表修改如下:

.ui-overlay-a,.ui-page-theme-a,.ui-page-theme-a .ui-panel-wrapper {

background-image: url(bgimage.gif)//设置背景图片

background-repeat: repeat//背景图片小于背景容器大小时是否重复图片

background-color: #f9f9f9//设置背景颜色

border-color: #bbb//边框颜色

color: #333//字体颜色

}

方法/步骤

1

访问JQuery Mobile官方网站

2

下载JQuery Mobile文件

3

解压JQuery Mobile文件,工程目录如下图所示。

4

将该文件夹中的相关文件拷贝到新建的工程目录中,如下图所示:

5

需要去除JQuery Mobile的默认样式有以下三种方法:

第一种方法是将 data-theme的取值改为大于e的值(以字母大小排序)

本例将data-theme改为了m,读者可以自行更改,但是不能在默认的a-e五种默认样式之间

6

第二种方法,将data-role的取值改为none

7

第三种方法找到JQuery Mobile默认样式的类选择器或是ID选择器,在JQuery Mobile 的css文件找到删除或者不删除,在你的样式里重写 但是后面加上 !important 作用是提高指定CSS样式规则的应用优先权。

以上三种方法可以解决默认样式的问题,至少我几年开发中都是用以上解决问题,还没有不能解决的问题。

http://jingyan.baidu.com/article/3c48dd34849e0ce10be35835.html