前端开发正处在高速前进的路上,尤其是开源社区更是如此,每天都有很多的博客和项目诞生。下面将推荐一些我喜欢的前端开发资源,关于前端框架、教程和工具等。
Pure
一组小,响应CSS模块,你可以使用在每个Web项目。
8 Pure CSS Flat Mobile Devices
Minimal iPhone, Android, Lumia and iPad devices in pure CSS to showcase the prototypes you create. Grab the code, remix and enjoy.
How to create a scrollable splash screen with CSS3 and jQuery
A great way to catch the attention of a visitor to your website is a “splash screen” or an “intro screen”. In this tutorial you’ll learn a basic method to achieve this effect, which you can modify easily to make nice-looking intros to web experiences.
Macaw
Macaw provides the same flexibility as your favorite image editor but also writes semantic HTML and remarkably succinct CSS. It’s time to expect more from a web design tool.
Ratchet
Ratchet is a full fledged framework, Ratchet began as a series of HTML/CSS prototypes of the Twitter for iPhone app. These prototypes became invaluable to the process of testing new feature designs that ended up being shipped as part of the native mobile app.
Bourbon Neat
A lightweight semantic grid framework for Sass and Bourbon.
A to Z CSS
Learn CSS from A to Z. Guy Routledge shares his knowledge and experience in high-quality video series.
Medium-Style Page Transition
An article on how to achieve Medium’s next page transition effect—an effect that can be seen by clicking anywhere on the “Read Next” footer at the bottom of the page.
Card
Make your credit card form better in one line of code. Beautiful animations for 4 different card types, an intuitive experience for your users and pure CSS, HTML, and Javascript.
Gumby
Gumby Framework is a flexible, responsive CSS Framework, Powered by SASS. Create rapid and logical page layout and app prototypes with a flexible and responsive grid system and UI kit.
CSShake
Useful CSS classes for making shaky animations for your web apps.
Bounce.js
Bounce.js lets you create tasty CSS3 powered animations in no time. Give it a spin.
Pleeease
Pleeease is a CSS post-processor. The main goal of this tool is to perform all treatments that a pre-processor shouldn’t have to do (dealing with prefixes, convert rem to px, support older browsers, etc.).
CSS Colours
A handy list of colour names in CSS, hex and rgb values are provided.
extractCSS
extractCSS is an online tool which can extract ids, classes and inline styles from HTML document and output them as CSS stylesheet. All you have to do is to type or paste your HTML document and let extractCSS to do the rest for you.
CSS Vocabulary
A small app to browse through which is what in CSS. Has some sample css with a list of CSS terminology. Clicking on anything in one panel highlights the corresponding items in the other.
Project Parfait
Project Parfait allows you to turn Photoshop comps into code-based designs. Right in your browser you can extract color, gradient and font from a PSD, copy text and CSS, get accurate measurements between elements and save web-optimized images.
Jeet Grid System
Jeet allows you to express your page grid the same way a human would describe it. No more needlessly nesting elements. No more rigid twelve column rules. Enjoy building faster with less code, and more flexibility with Jeet.
Cody
Cody is a free library of HTML/CSS/JS nuggets to boost your web projects.
Magic Animations CSS3
CSS3 Animations with special effects. Now on beta, more effects coming soon.