发表于: 2017-03-01 22:13:59

1 1186


今天完成的事情:

1、今天写了【前台-找职位】的js部分,成功获取了推荐职位和最新职位的数据;

2、今天完成了【前台-搜索结果】的切换效果;

3、听龚家豪讲选择器的种类和优先级。

明天计划的事情:

完成【前台-搜索结果】的静态页面和数据获取

遇到的问题:

今天主要遇到了选择器的权值问题。先贴代码:

<div class="row toggleSearch">

    <button ng-class="{'search-btn':!vm.isChoose}" ui-sref="field.searchMain.searchCompany"

ng-click="btn_Toggle(!vm.isChoose)">公司</button>

    <button ng-class="{'search-btn':vm.isChoose}" ui-sref="field.searchMain.searchJob"

ng-click="btn_Toggle(vm.isChoose)">职业</button>

</div>

代码可以简化为:

<div class="row toggleSearch">
    <button class="search-btn">公司</button>
    <button class="search-btn">职业</button>
</div>

问题是在css里面设置的.search-btn样式无效。css里面是这样写的:

.search-btn{ background-color: #fc2b47; color:white;}

尝试把class换成id,结果样式其作用了。于是怀疑是选择器的权值问题,于是改写了css:

.toggleSearch>button.search-btn{ background-color: #fc2b47; color:white; }

通过这种方法,可以增加.search-btn的权值,后来css样式果然起作用了。

收获:

1、学习了ng-class的用法;

可以参考这两篇链接:

https://segmentfault.com/a/1190000004328991

https://segmentfault.com/a/1190000008393758

2、对权值的理解有了新的认识。


返回列表 返回列表
评论

    分享到