前端在线工具

一、SVG在线制做编辑预览工具

　　

　　SVG在线制做编辑预览工具 ： https://www.bejson.com/ui/svg_editor/  （里面包括不少前端经常使用的工具）

　　　　　　　　　　　　　　　  http://www.gaituba.com/svg/   （里面包括不少前端经常使用的工具）

　　SVG WEB在线编辑器　：　http://www.86y.org/demo/svg/

二、CSS3 一些动画，转换的效果，应该是有在线工具能够生成代码的。（网上找找看）

　　http://www.css88.com/tool/css3Preview/Transform.html

三、flex弹性布局  在线预览效果

·　 http://www.css88.com/demo/flexbox-playground/ 

 四、CSS3 动画

　　http://jeremyckahn.github.io/stylie/

　　http://www.25xt.com/html5css3/14308.html   （这里有各类动画的在线工具，包含有CSS3动画的库）

 五、可视化的正则表达式编辑工具   ：     https://www.csdn.net/article/2014-11-27/2822843-tools?reload=1

　　在线正则表达式测试　　：　　　https://c.runoob.com/front-end/854

　　　　　　　　　　　　　　　　http://tools.jb51.net/tools/regex.asp  (这个正则表达式测试包括m，换行的匹配)

 六、CSS选择器 nth-child的演示   ：      http://nthmaster.com/

七、HTML5 Video Events and API  ：   https://www.w3.org/2010/05/video/mediaevents.html

八、JSON在线编辑器 ：http://www.bejson.com/jsoneditoronline/ 

九、RGB颜色值与十六进制颜色码转换工具 ：https://www.sioe.cn/yingyong/yanse-rgb-16/

十、javascript 变量名 正确与否 检测网站：https://mothereff.in/js-variables

 

 

注：前端有一些工做是不须要本身很是熟练去使用的，有的工做很是简单可是很浪费时间，这些工做大部分是能够利用在线工具帮咱们很快解决的。

　　如：一、json数据的生成；二、CSS3的动画以及转化，若是要本身去写代码，经常须要去看文档比较浪费时间（由于不经常使用），这个时候能够借助在线工具，跳到本身须要的效果，看CSS样式都有哪些；等等。