那些令人惊叹的 HTML、CSS、JavaScript 工具和库

js.jpg

每日推荐

所以今天我收集一系列省时的、有用的 HTML、CSS 和 JavaScript 资源给大家。我希望这些工具将帮助您提高专业技能以及工作流程。

1、前言

前H端开发很奇妙: 它入门很简单，但是想要成为大牛却很难。有太多的事情需要考虑，到处都有需要微调的地方，太多的细节处理才能保证让一切都刚刚好。幸运的是，开发者和设计师一直致力于为我们提供有用的工具和资源，来提高我们的技能、让我们做的更好。

2、Initializr

Initializr

此工具创建一个基于 HTML5 Boilerplate 的可自定义模板。 在 JavaScript 和 jQuery 之间进行选择，决定是否要样本内容，并指定兼容性和服务器配置需求。 您将获得一个拥有 Boilerplate 主要功能的模板，以开始您的项目。

3、Layer Styles

Layer Styles

一个非常简单的工具，以直观的方式来创建 CSS ——非常像一个图形编辑器。该工具允许您添加阴影、内阴影、背景、边界和圆角和生成跨浏览器的 CSS 代码。

4、Mobile Boilerplate

Mobile Boilerplate

一个能够创建丰富的和高性能的移动 Web 应用程序模板。它可以保证各种浏览器的兼容性，不仅能兼容各种高端智能机，也能兼容旧版的黑莓、塞班、以及微软的移动平台。

5、Vogue

Vogue

该工具在所有浏览器中重新加载页面的样式表（而不是 HTML ），甚至可以配置为在多个浏览器中同时自动重新加载页面。 该工具不托管您的网站，而是运行您的网站本身的本地服务器。 要使用它，只需安装 NodeJS 和 npm 。

6、Css-x-fire

Css-x-fire

此工具允许从 Firebug CSS 编辑器编辑 IDE 中的 CSS 属性，并允许开发人员专注于 CSS 样式，而无需刷新浏览器。

7、Ffffallback

Ffffallback

一个可以让您测试不同字体栈以找到最佳结果的书签。它扫描页面的 CSS 并创建一个克隆页面，您可以在其中测试和分析不同的 fallback 字体。

8、Spritemapper

Spritemapper

该应用程序将多个图像合并为一个，并为相应的切片生成 CSS 定位; 通过减少图像的数量和更好地利用连接，CSS spritemapping 可以减少您的网站的加载时间。

9、PCSS

PCSS

一个 PHP 驱动的 CSS 预处理器，可以帮助您以更少的代码释放 CSS3 的功能，如类嵌套、服务器端浏览器细节、默认单位和变量。该工具需要 PHP5。

如果你有更好的心得和建议，欢迎拍砖一起探讨。欢迎搜索微信公众号加入【极客小寨】。

欢迎加入QQ群【极客小寨】(689112212)。

wechat_code01.jpg

欢迎关注投稿~