介紹CSS編譯工具CSS Lint

2021-05-28 10:05:27 字數 1290 閱讀 2866

不久以前,nicole sullivan 和我宣布在一起工作。現在我們很高興的向大家宣布我們

第乙個合作的成果css lint誕生了,就像你們所猜想的那樣,css lint的目的就是幫助你

寫出更好的css**。在過去幾周我們花大量的時間,建設和辯論規則,以幫助大家編寫更

有效和更優秀的css**

規則剛開始,我們制訂了一些規則(在css lint about中有詳細的解釋)。這些規則是:

1.解析錯誤應該被修復

2.不要使用多個class選擇元素

3.移除空的css規則

4.正確的使用顯示屬性

5.不要使用太多的浮動

6.不要使用過多網路字型

7.不要使用過多的字型大小

8.不要使用id作為樣式選擇器

9.不要限定標題

10.標題樣式只定義一次

11.小心使用寬度100%

12.屬性值為0是不要寫單位

13.css的漸變屬性需要指定字首

14.個瀏覽器專屬的樣式要有規範

15.避免使用看起來像正規表示式的css3選擇器

16.遵守盒模型規則

這些規則都是通過使用乙個非常簡單的外掛程式模型來建立的,它可以很容易地改變特定的規則或新增新的規則。開啟或關閉特殊

的方法還沒有暴露在web介面或是命令列上,但是他受到底層api的支援,所以尋找它的增加規則的方法很快。

在你的專案中

當我們高興的介紹我們的web頁面時,我們也注意到你們想把這個合併到你專案的框架中,為了為你們提供這方面的幫助,這裡有為node.js

提供的css lint,你可以通過安裝npm包的方式來安裝css lint:

sudo npm install -g csslint

一旦安裝成功,你就可以匯入任意數量的css檔案或是目錄了:

csslint foo.css bar.css dir_of_css/

這個工具會和web介面輸出同樣的資訊

貢獻css lint在github是乙個完全開源的專案,我們正在積極的尋找貢獻規則,修改bug和擴充套件的開發人員,這個工具的規則是可擴充套件性的,

通過這種方式,你可以很容易的去掉你不要的規則或是增加你需要的特殊規則,然後建立乙個客戶版本(或是說第三方版本)來適應你的需要

或者 貢獻給大家使用。

css的解析程式 也是在dithub上的乙個開源專案,這個程式有一些已知的問題我計畫盡快處理掉,但是他符合css3的標準。

我希望我和 nicole可以創造出更多的這方面的工具來幫助你們寫出更好規範的前端**,讓我們享受這個過程吧!

翻譯的不好 ,希望大家多多指教

CSS預編譯工具(SASS,LESS)

sass和less都是專用於css的預編譯語言,他們2者的功能,操作都是大同小異。less稍微簡單一些,而sass有一些比較成熟的框架 如compass 功能強大一些,其中的語法也比較符合一門程式語言的習慣,比如說函式,作用域,程序控制等等。所以,我也是選擇的sass來使用。一 sass中文官網 使...

css編譯工具之postcss

postcss是乙個依賴postcss外掛程式處理css工程化問題如 編譯未來css語法和css預編譯語法為瀏覽器能相容和識別的css語法的工具。安裝postcss和其命令列工具 預設 npm i d postcss postcss cli postcss preset envpostcss cli...

Linux IDE編譯工具的開發介紹

linux ide編譯工具的開發介紹 技術交流qq群 513138238 用於公布軟體最新版本資訊和相關技術交流 v1.0.0 二,軟體簡介 android常用開發工具eclipse和android studio本身自帶有日誌檢視工具logcat,一般性使用基本滿足要求。但若長期處於android的...