如何在使用jquery mobile时重写自带的某一个css样式

html-css053

如何在使用jquery mobile时重写自带的某一个css样式,第1张

JQuery Mobile去掉自带样式改成自己写的样式可以有以下3个方式

1、将 data-theme的取值改为大于e的值(以字母大小排序)

2、如果是超链接等可以将data-role的取值改为none

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

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

问题1,很显然是不合理的,增加一个属性可以,改变就不行。如果硬要这样做,可以采取细一点的方式,例如为a定义一个样式: .apage a 和 .bpage a 在A页面是<div class="apage"><a ...>...</a></div>而在B页面 则是 <div class="bpage"><a ...>...</a></div>

问题2,尽量将所有的样式表都放在一个单独的CSS文件里,网站所有的页面都调用这一个文件。要明白,CSS、HTML 都不是运行程序,而只是代码,效率和文件的大小有很直接的关系,如果10个页面10个CSS,明显的没有达到这样的目的。

浏览器打开一个页面时,同时也下载了CSS到IE的临时文件夹中(除非CSS不是一个单独的文件),再打开其他页面,如果引用的是同一个CSS,就不会再进行下载。显而易见,下载10个文件要比下载1个文件效率低得多,即使这1个文件比10文件加起来还大。

回复楼下的看法:一个网站的所有页面不可能有非常多的区别,况且CSS是在客户端执行,完全不涉及到服务端,况且浏览器是先看样式名,再根据样式名去查找相符合的样式。不是把所有的样式都遍历一次,你所说的打开页面慢、CUP频率高貌似不大可能出现。即使有,那也不是因为样式表很大的缘故,即使是因为样式表非常大,这样的影响也小到可以忽略,即使明显,也只是在客户端,和客户机有较大关系,对服务端不会造成任何压力。

如果你很不喜欢这样的方式,至少可以把布局大致相同的页面引用某一个CSS,完全不相同的引用另一个CSS。但是一个页面一个CSS,绝对更不可取。

请注意你的CSS样式书写有问题,宽度是width,而不是你写的witdh,你仔细检查下就行了。

另外:你既然前面写的是 .divwrap ul li 后面最好写成:.divwrap ul li.masli,这样比较规范。

如:

.divwrap ul li{ width:200pxheight:30pxdisplay:blockbackground-color:#0f3}

.divwrap ul li.masli{ width:100pxheight:20pxdisplay:blockcolor:redbackground-

color:#f96}