15 必不可少的 Sass 和 Compass 工具

jopen 11年前發布 | 32K 次閱讀 Compass

學過CSS的人都知道,它不是一種編程語言。
你可以用它開發網頁樣式,但是沒法用它編程。也就是說,CSS基本上是設計師的工具,不是程序員的工具。在程序員眼里,CSS是一件很麻煩的東西。它沒有變量,也沒有條件語句,只是一行行單純的描述,寫起來相當費事。
很自然地,有人就開始為CSS加入編程元素,這被叫做"CSS預處理器"(css preprocessor)。它的基本思想是,用一種專門的編程語言,進行網頁樣式設計,然后再編譯成正常的CSS文件。
SASS是各種"CSS預處理器"中的一種。 SASS是一種CSS的開發工具,提供了許多便利的寫法,大大節省了設計者的時間,使得CSS的開發,變得簡單和可維護。Sass是一種"CSS預處理器",可以讓CSS的開發變得簡單和可維護。但是,只有搭配 Compass,它才能顯出真正的威力。Compass是Sass的工具庫(toolkit)。

Sass本身只是一個編譯器,Compass在它的基礎上,封裝了一系列有用的模塊和模板,補充Sass的功能。它們之間的關系,有點像Javascript和jQuery、Ruby和Rails、python和Django的關系。

今天,我們將分享15個基本Sass和Compass工具,以提高您的Sass知識。讓我們來看看他們。

1. The Sass Way

15 必不可少的 Sass 和 Compass 工具

If you are looking for information on creating CSS with the help of Sass and Compass, The Sass Way is perfect for you. With so many great regular updates, you must follow them on 推ter and Faebook and benefit from their tutorials..

2. Compass.app

15 必不可少的 Sass 和 Compass 工具

Compass.app 是一個針對 Sass 和 Compass 的菜單工具,幫助設計師通過 UI 的方式編譯樣式,而不用去記住命令行。它是用 JRuby 開發的,可以在多個平臺上使用,而不用安裝 Ruby 環境。

3. Scout

15 必不可少的 Sass 和 Compass 工具

SASS編譯的界面工具。Scout is basically an app that is known to be a great cross=platform app. It allows you to run Sass and Compass within a ruby environment and allows you to handle your projects smoothly. Scout will take care of all the complex stuff and you will not have to setup ruby.

4. Compass Recipes

15 必不可少的 Sass 和 Compass 工具

If you are looking for great backgrounds, awesome effects, stylish icons, incredible layouts and a lot more, Compass Recipes ins perfect for you.

5. Bourbon

15 必不可少的 Sass 和 Compass 工具

Bourbon is basically a library of Sass mixins, which is designed in way that it will only make things easier. You will not have to configure anything and with bourbon, you can also degrade to old browsers and that too without any hassle.

6. Bourbon Neat

15 必不可少的 Sass 和 Compass 工具

Bourbon near will allow you to take care of responsive layout. It encourages clean and reliable Sass mixins.

7. Susy

15 必不可少的 Sass 和 Compass 工具

If you have been looking for responsive grids for a compass, Susy is here to help you with it. By using Susy, you can create website within a few minutes.



8. Codekit

15 必不可少的 Sass 和 Compass 工具

Codekit is basically a complier that you will help you in saving files automatically of Coffeescript, JAvaScript, Sass, Compass and a lot more. Codekit will also reduce the load times since it combines the files.

9. Sassy Buttons

15 必不可少的 Sass 和 Compass 工具

Sassy buttons, as the name suggests, will help you in creating CSS3 buttons and will also allow you their customization. All you have to do is use some minimal Sass lines.

10. LiveReload

15 必不可少的 Sass 和 Compass 工具

LiveReload basically exists within you menu bar in order to keep an eye on the any sort of changes appearing in the file system. The file is preprocessed instantly after any sort of changes are made and the file is saved.

11. Hammer

As far as hammer is concerned, it has been declared as  a game changer for the world of web development. IT offers Sass’s built-in support along with automatic compilation to CSS.

15 必不可少的 Sass 和 Compass 工具

12. Forge

15 必不可少的 Sass 和 Compass 工具

Forge will help you in creating WordPress themes using a simple and neat environment with the help of front-end languages.

13. Normalize.css (with Sass or Compass)

15 必不可少的 Sass 和 Compass 工具

This is a popular tool and is a great alternate to CSS reorganization. It will help all browsers in submitting elements with consistency.

14. Sass for WordPress

15 必不可少的 Sass 和 Compass 工具

As the name suggests, Sass is basically a plugin for WordPress, which allows user to use Sass within his WordPress projects. This plugin will help you in keeping a check on your Sass files and it will recompile your CSS whenever it is required.

15. Sassaparilla

15 必不可少的 Sass 和 Compass 工具

Sassaparilla 是一組創建響應式網站的規則和風格,Sassaparilla 使用 Sass 和 Compass 建立靈活的可重用的樣式表,幫助你簡單、快速的創建出響應式網站。

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!