为Sass用户准备的 25个新鲜资源

jopen 10年前

Sass是CSS扩展语言的一个非常稳定的版本,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护。

Profound Grid

If you are looking to create fixed or fluid layouts for your next project, this particular resource offers a powerful and flexible way for you to achieve that. It will equip you to do, you work efficiently and with a lot of ease.

为Sass用户准备的 25个新鲜资源

Gridle

This is a grid system, as may be evident by the name. It was created using Sass and it includes loads of customizing for displaying data beautifully on your devices such as the iPad, iPhone and other smart handheld.

为Sass用户准备的 25个新鲜资源

Frameless Grid

If you are one of those developers who is a fan of responsive design (as one should be these days) and you hate fluid grids, you may want to try out the frameless grid. This particular grid will adapt to your design not based on pixels, but based on columns. You will be pleased with the results.

为Sass用户准备的 25个新鲜资源

Salsa

If you are familiar with the version 2 of Susy, you will see this resource as a part of it. If you are one of those that prefer simple and pretty much a featureless grid system, Salsa is your way to go.

为Sass用户准备的 25个新鲜资源

Table Grid System

This particular resource utilizes tables at its base. This is a rather simple but elegantly beautiful grid system that you will find very useful for quite a lot of your projects. You can thank the developer later.

为Sass用户准备的 25个新鲜资源

Grid by Chris Coleman

If you are looking to create websites that seem elegant and are seamlessly balanced, you may want to try out this grid system that presents an optimal combination of columns and clutters. Makes the job easier, while empowering it with beauty.

为Sass用户准备的 25个新鲜资源

Results Grid

This particular grid system was created by Ehren Coker based on Sass. It leverages inline blocks, floating elements and media queries in order to provide you with a system that will work flawlessly across a variety of devices in use these days.

为Sass用户准备的 25个新鲜资源

Glitched Text

This is a code snippet which allows you to display a really cool effect to your project. It may look scary at first, but once you are warmed up to it, you will notice it is actually quite unique and distinct. You can apply the effect to images and text.

为Sass用户准备的 25个新鲜资源

Flat button Generator

If you are looking to use flat styled buttons on your website, you may want to use this generator. It is graceful and quite effective at the same time.

为Sass用户准备的 25个新鲜资源

Clean Sticky Footer

If you are running a parallax-based website, you will be pleased with this sticky bar that is fixed at the bottom. You display your offers and other news in this sticky footer. You can also display a navigation with the footer to enhance the overall experience.

为Sass用户准备的 25个新鲜资源

 

Ghost Buttons

While these may not look like buttons, they actually are and they are rather simple to create too. Referred to as ghost buttons, they have a subtle line surrounding them and an active hover effect. It is a definite must for any website these days.

为Sass用户准备的 25个新鲜资源

Mixin for Targeting iPad

This particular resources is for users who are willing to calibrate their websites to an iPad device. It is a helpful solution.

为Sass用户准备的 25个新鲜资源

Radial-Gradient SASS Mixin

While gradient are not all that popular these days anymore, some website still employ the use of gradients, and if you are running one with gradients on it, then this tool is a must try for you.

为Sass用户准备的 25个新鲜资源

Font-Size Mixin

This will take your font size along with the units and generate a font-size CSS declaration. It will also include fallbacks in case somebody is running older browsers.

为Sass用户准备的 25个新鲜资源

Long Shadow Generator

The designs have gone flat, and one thing that compliment a flat icon is a long shadow. This is your resource to make those beautiful long shadows and add elegance to the entire look.

为Sass用户准备的 25个新鲜资源

Buttons

This particular set includes loads of flat styled buttons with their distinct contours. They are presented with a solid and hollow look. You can use whichever you prefer.

为Sass用户准备的 25个新鲜资源

Switches

This is pretty much the same as the previous resource. the only difference is that you make switches instead of buttons.

为Sass用户准备的 25个新鲜资源

Map Magic, Buttons

This resource will provide you with pre-defined buttons for call-to-action, dribbble, github, and 推ter etc. You can use the same technique behind this and create other graphical elements if you require.

为Sass用户准备的 25个新鲜资源

Responsive Menu

This particular snipped is rather helpful as it will let you add a compact slide out navigation menu on your website. The bar is responsive too.

为Sass用户准备的 25个新鲜资源

Search Engine UI

This is a user-interface for a search line. It will generate the search box dynamically, and neatly format the search results. You will be offered a small horizontal navigation as well.

为Sass用户准备的 25个新鲜资源

Marv

This resource offers loads of different instruments that offer improvement in the WordPress theme development. The instruments also use LESS and CoffeeScript.

Gravity Forms Sass

If you are already using gravity forms in your WordPress website, this tool will make the experience more productive and efficient.

为Sass用户准备的 25个新鲜资源

Mojolicious Plugin Assetpack

This will allow you to reduce the weight of your project files by systematically converting and compressing your Sass files.

为Sass用户准备的 25个新鲜资源

Easy Sprites

This plugin works flawlessly with Compass and Sass. It will create multiple sprites for you allowing you to effectively work with retina displays.

为Sass用户准备的 25个新鲜资源Hapi Sass

Finally, we have the Hapi Sass, which is a plugin aimed at compiling and serving Sass stylesheets by getting the most out of node-sass as possible.

为Sass用户准备的 25个新鲜资源