csslint在前端项目中的使用
大家都听说过jslint,eslint,不过你可能没见过csslint,你可能会问csslint有什么用,为什么今天要说csslint,是因为我在开发中遇到一个坑,其实之前不怎么使用csslint的,既然踩到坑了,就要解决。
是这么回事,我在写css的时候不小心在括号后面多写了一个分号,可能是习惯问题,以为在写js,就带上了一个分号,在我手机上(安卓6.0)运行没问题,结果老板说在他手机(安卓4.4)有问题,就是一个动画没有效果,我一开始想,我用了css3的新属性做动画,会不会是兼容性问题,我在Can i use查过transform,animation的兼容性,发现4.4是支持css3动画属性的。怎么想都不知道问题出在哪。我又不想用js去做动画,毕竟影响性能。没办法,找不到问题所在,于是我打算用js去做动画。正准备写js的时候,突然看到css代码多了分号,我去掉后结果就好了。
问题虽然解决了,我就在思考,如果后期开发中还会遇到这样的问题怎么办。于是我就想起来之前看到过csslint的文章,我去csslint官网检查了一下我的css代码,果然有问题。由于我的手机版本比较高,可能自动修复了错误。低版本的可能就报错了。
如果你的项目采用模块化,npm上面有csslint的插件,使用webpack打包工具可以整合csslint。如果不是模块化,你可以到csslint官网,直接把你的css代码粘贴,然后进行验证。csslint可以配置验证规则,你可以根据自己的需求进行配置。
所以以后开发尽量使用csslint去检查一下css代码的正确性。


csslint在前端项目中的使用的更多相关文章
- 前端项目中使用jsencrypt进行字段加密
前端项目中使用jsencrypt进行字段加密. 使用步骤:①获取公钥②实例化对象③设置公钥④将所需数据进行加密然后返回. 进行一个简单的封装如下 /** * npm install jsencrypt ...
- 在Vue&Element前端项目中,使用FastReport + pdf.js生成并展示自定义报表
在我的<FastReport报表随笔>介绍过各种FastReport的报表设计和使用,FastReport报表可以弹性的独立设计格式,并可以在Asp.net网站上.Winform端上使用, ...
- 在Vue&Element前端项目中,对于字典列表的显示处理
在很多项目开发中,我们为了使用方便,一般都会封装一些自定义组件来简化界面的显示处理,例如参照字典的下拉列表显示,是我们项目中经常用到的功能之一,本篇随笔介绍在Vue&Element前端项目中如 ...
- 在Vue前端项目中,附件展示的自定义组件开发
在Vue前端界面中,自定义组件很重要,也很方便,我们一般是把一些通用的界面模块进行拆分,创建自己的自定义组件,这样操作可以大大降低页面的代码量,以及提高功能模块的开发效率,本篇随笔继续介绍在Vue&a ...
- 如何在前端项目中引用bootstrap less?
在基于bootstrap css框架的前端项目开发中,如果有grunt build系统,那么工作流是:客制化less,在less中定义自己的 CSS,同时可以随意引用bootstrap中预定义好的cs ...
- 前端项目中gulp的使用
在公司项目开发中,有一个前端项目,我们使用gulp来生成目标文件(css,js,html文件) 进入到这个项目目录中 C:\My Project\FrontEnd\TestBuilder 然后依次运 ...
- web前端项目中遇到的一些问题总结(08.23更新)
个人网站 https://iiter.cn 程序员导航站 开业啦,欢迎各位观众姥爷赏脸参观,如有意见或建议希望能够不吝赐教! 写一些最近工作中Vue项目中遇到的问题. 巴啦啦小魔仙,污卡拉,全身变,小 ...
- 前后端分离,如何在前端项目中动态插入后端API基地址?(in docker)
开门见山,本文分享前后端分离,容器化前端项目时动态插入后端API基地址,这是一个很赞的实践,解决了前端项目容器化过程中受制后端调用的尴尬. 尴尬从何而来 常见的web前后端分离:前后端分开部署,前端项 ...
- 前端项目中使用git来做分支和合并分支,管理生产版本
最近由于公司前端团队扩招,虽然小小的三四团队开发,但是也出现了好多问题.最让人揪心的是代码的管理问题:公司最近把版本控制工具从svn升级为git.前端H5组目前对git的使用还不是很熟悉,出现额多次覆 ...
随机推荐
- Android O 正式版新功能
ref: Android O新特性和行为变更总结zzhttp://www.cnblogs.com/bluestorm/p/7148134.html Android O正式版带来了诸多新功能,如Tens ...
- 那些ie6已支持的方法属性,成为事实标准。或者方便大家的api
很多api,都是ie6实现,后来其他w3c或其他浏览器支持,或者用类似的方法模拟 onselectionchange 判断选区改变 ,chrome已支持 Element.contains 判断元 ...
- ubuntu 安装python3.6.6
http://www.cnblogs.com/yhongji/p/9383857.html https://www.jianshu.com/p/1565f38f4236 ./configure --w ...
- D. Petya and Array 树状数组
题意: 给出一个数组,元素有正有负有0,问其区间和小于 t 的子区间的个数. sum[ r ]-sum[ l-1 ]<t,其中sum是a的前缀和. 实现的方法就是从前往后对于每一个sum[ i ...
- tp 事务处理
tp的事务开启是非常简单的, 只需要M()->startTrans();//开启事务,M()可以是M('xxx') $m->rollback();//事务回滚 $m->commit( ...
- python基础之collections模块
Counter Counter是一个简单的计数器,可以统计一段字符串中各个元素出现的次数: import collections counter_1=collections.Counter('kjsd ...
- 使用uwsgi配置django
1.uwsgi的安装 pip install uwsgi 2.uwsgi的基本测试: 创建一个test.py文件,内容如下: def application(env, start_response): ...
- ElastAlert监控日志告警Web攻击行为
由于公司需要监控web攻击行为,而因某些原因搭不了waf,才不得不用ElastAlert进行告警,此为前提. 一.ELK安装 Elasticsearch 是一个分布式.可扩展.实时的搜索与数据分析引擎 ...
- ECMAScript6语法检查规范错误信息说明
项目中使用ECMAScript6的时候经查会使用语法检查,下面是常见错误信息的汇总: “Missing semicolon.” : “缺少分号.”, “Use the function form of ...
- CSS3 颜色模式
HSL .test{background-color:hsl(<length>, <percentage>, <percentage>);} 1.length 表示 ...