mui 怎么"去除"mui-active

来源:互联网 发布:北师大网络教育平台 编辑:程序博客网 时间:2024/04/29 01:22

     在使用mui的过程中,list是比较常用的 ,今天刚好遇到了这样一个问题,tap时会有背景出现,也就是mui-active,按自己的理解,写了这样的css

.mui-table-view-cell .mui-active{background-color: #fff;}

然而并没有什么卵用,尝试各种方法未果,再去看了下官方文档 ,使用如下css代码可以成功

.mui-table-view-cell.mui-active{background-color: #fff;}

乍一看感觉2个没什么区别啊,但是兄弟仔细看一看,下面的2个类之间是没有空格分隔的.

     那么再拓展一下,自己也记下,也防止后面的兄弟踩坑 ,在写css类的时候,中间有无空格有什么区别呢?

参照上面的代码,第一段代码相当于下面这样:

<li class="mui-table-view-cell "><span class="mui-active">微信 : </span>{$data['wechat']} </li>

第二段代码相当于这样:

<li class="mui-table-view-cell mui-active "><span class="">微信 : </span>{$data['wechat']} </li> 

 可以知道:

1.       有空格分隔是后代选择器,是包含关系,表示选择的mui-table-view-cell 下面的mui-active.  

2.       没有空格分隔则是在一个元素上,即 li 同时有mui-table-view-cellmui-active ,这个元素同时有这2个类才起作用.      





2 0
原创粉丝点击