一直想把自己遇到的好用的工具、框架、技术文章之类的做一个汇总记录,但是一直没时间去弄,今天得空,先把工具软件整理下,文章会不断更新。
IDE
Visual Studio
一个丰富的集成开发环境,用于创建面向 Windows、Android 和 iOS 的出色的应用程序及现代 Web 应用程序和云服务。
PS:因为本人从.net转的前端,所以对于VS的留恋还是有的。
下面列举此IDE下的一些有用的插件:
Emmet
Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生。它使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度。
代码示例:
/*输入*/
ul.list-group>li.list-group-item*3>span{跳转至}+a[href='sf.gg']{sf.gg}
<!--结果-->
<ul class="list-group">
<li class="list-group-item"><span>跳转至</span><a href="sf.gg">sf.gg</a></li>
<li class="list-group-item"><span>跳转至</span><a href="sf.gg">sf.gg</a></li>
<li class="list-group-item"><span>跳转至</span><a href="sf.gg">sf.gg</a></li>
</ul>
Web Essentials
(下载)
为VS提供一些Web开发常用功能的扩展,如:
JS、CSS代码折叠(支持region折叠);
生成兼容性CSS代码;
背景图片Base64转换;
CSS图片预览,鼠标移至背景图片的代码时
(background:url('a.jpg'))
,预览图片;支持TODO注释的特殊显示(在含有TODO注释的代码行前显示一个特殊的图标);
浏览器相关
Chrome
Chrome浏览器上一些非常好用的插件:
ruul. Screen ruler
下载
在页面中插入一把尺子,可以度量网页元素宽高、辅助对齐等。
EditThisCookie
下载
一款可以管理Chrome浏览器中cookies的插件,用户可以利用EditThisCookie添加,删除,编辑,搜索,锁定和屏蔽cookies。
Web开发工具箱
下载
全能的开发工具箱,什么编码、格式化、大小写转换、代码美化压缩、加密解密,应有尽有。
在线资源
Chrome插件下载
在线雪碧图制作
网址:http://spritegen.website-performance.org/oldsites/spritegen/htdocs/
支持中文
支持自定义前缀
支持图片压缩
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。