Ⅰ css preprocessors 怎麼用
css preprocessors就是css預處理器, 主要是塌毀為了叫你更快寫css的。 建議你先熟練掌握css的寫法,之後可以看看現在使用比較廣泛的三款預處理陸搜器,Sass、LESS 和 Stylus
給你個參考資料可以看看,空間里還有一些其他早衫歷的前端知識。
參考資料:http://user.qzone.qq.com/47935982/blog/1397135243
Ⅱ 什麼是預處理器,簡單點說,可否舉個例子。
,,如果是指編程方面野納早而言,茄帆預處理器是在程序真正的編譯開始之前,由編譯器調用的獨立程序。預處理器可以刪除注釋、包含其他文件以及執行宏(宏macro是一段重復文字的簡短描頌雀寫)替代。
Ⅲ vc++中的預處理器定義是干什麼用的
預處理(pre-treatment),是指在進行最後加工完善以前進行的准備過程,具體應用在不同的行業或領域,會有不同的解釋。
在一些程序設計語言中,預處理是preprocessing的翻譯。
含義
程序設計領域中,預處理一般是指在程序源代碼被翻譯為目標代碼的過程中,生成二進制代碼之前的過程。典型地,由預處理器(preprocessor) 對程序源代碼文本進行處理,得到的結果再由編譯器核心進一步編譯。這個過程並不對程序的源代碼進行解析,但它把源代碼分割或處理成為特定的單位——(用C/C++的術語來說是)預處理記號(preprocessing token)用來支持語言特性(如C/C++的宏調用)。
C/C++預處理
最常見的預處理是C語言和C++語言。ISO C和ISO C++都規定程序由源代碼被翻譯分為若干有序的階段(phase) [1] [2] ,通常前幾個階段由預處理器實現。預處理中會展開以#起始的行,試圖解釋為預處理指令(preprocessing directive) ,其中ISO C/C++要求支持的包括#if/#ifdef/#ifndef/#else/#elif/#endif(條件編譯)、#define(宏定義)、#include(源文件包含)、#line(行控制)、#error(錯誤指令)、#pragma(和實現相關的雜注)以及單獨的#(空指令)[1] [2] 。預處理指令一般被用來使源代碼在不同的執行環境中被方便的修改或者編譯。[3]
預處理器在UNIX傳統中通常縮寫為PP,在自動構建腳本中C預處理器被縮寫為CPP的宏指代。為了不造成歧義,C++(cee-plus-plus) 經常並不是縮寫為CPP,而改成CXX。
注意預處理常被錯誤地當作預編譯(precompiling) ,事實上這是兩個不同的概念。預處理盡管並不是ISO C/C++要求的單獨階段,但「預處理」這個術語正式地出現並參與構成其它術語,如C的預處理翻譯單元(preprocessing translation unit)[1] 以及C/C++詞法規則中預處理記號(prerprocessing-token) 這個語法分類[1] [2] 。預編譯是一些編譯器支持的特性,不是C/C++語言的特性或實現必須要求遵循的規則涉及到的內容,沒有在ISO C/C++全文中出現[1] [2] 。
紡織物的預處理編輯
含義或目的
紡織物的預處理,是紡織物燒毛、退漿、精練、漂白、絲光和熱定形等工藝過程的總稱。預處理的目的是去除紗線或織物上的天然雜質,以及紡織過程中所附加的漿料、助劑和沾污物。經過預處理的紡織品具有較好的潤濕性、白度、光澤和尺寸穩定性。天然纖維含雜較多,其紡織物的預處理要求也較高,天然纖維與化學纖維混紡織物的預處理工藝,應以適合天然纖維為主,同時照顧化學纖維的要求。
預處理過程
燒毛是燒去紗線或織物表面的茸毛,使織物表面光潔,增進染色或印花後的色澤鮮艷度,在服用過程中不易沾塵。化學纖維織物燒毛後,還可減輕因茸毛摩擦而引起的起球現象。
退漿、精練、漂白過程都是去除織物上的各種雜質,三者相輔相成,各有側重。退漿以去除漿料為主,同時也可洗除部分水溶性天然雜質;精練是以去除纖維伴生的天然雜質為主,並可去除織物上殘留的漿料等物質;漂白是以去除色素為主,並進一步去除精練後的殘留雜質。棉、麻纖維織物大多要經過退漿,常用的有熱水、鹼液、澱粉酶、氧化劑等退漿法。精練對於棉紡織物非常重要,主要是通過燒鹼液的作用去除果膠質、棉脂、棉蠟等天然雜質,並使棉籽殼殘屑體解。棉纖維的漂白常用次氯酸鈉或過氧化氫。薴麻紡織物的精練、漂白工藝和棉相似。亞麻纖維的吸水性較好,精練要求較棉為低,可用純鹼處理。亞麻紡織物的漂白常用較廉價的次氯酸鈉酸性溶液處理,再用鹼液洗除反應產物。漂白和鹼處理可交替重復進行。羊毛精練通常是在原毛狀態進行的,又稱洗毛,主要是去除羊汗和羊脂。可用含碳酸鈉和肥皂或洗滌劑的練液在50℃左右使羊脂乳化而洗除。羊毛纖維一般不經漂白過程,需要時用還原劑如二氧化硫、亞硫酸氫鈉或連二亞硫酸鈉進行漂白,但漂白效果不持久,在空氣中會逐漸氧化而泛黃;用過氧化氫漂白劑效果較好。蠶絲織物的預處理主要是精練,目的是去除絲膠。脫膠用劑主要是肥皂液,可酌加碳酸鈉。也可先用蛋白酶處理,再經肥皂液洗滌。絲纖維的色素等雜質主要集中在絲膠中,脫膠後一般不再漂白。需要漂白時通常採用過氧化氫為漂白劑。合成纖維含雜極少,織造時大多選用水溶性漿料,且用量較少,退漿常結合精練進行,處理的條件可較溫和。錦綸織物用非離子型洗滌劑處理;漂白用劑以亞氯酸鈉最宜,過氧化氫或次氯酸鈉均易使纖維受損。滌綸雖然遇鹼會水解,仍可用淡鹼液作精練處理,但應嚴格控制溫度和時間,漂白用劑以亞氯酸鈉為最好,有時退漿、精練、漂白可同時完成。
絲光主要用於加工棉、麻紡織物。絲光過程的特點是紗線或織物浸漬濃燒鹼液,使纖維發生溶脹,再在張力狀態下洗去鹼液,從而獲得耐久性的光澤,有效地提高染料的上染率並有定形作用。
熱定形主要用於受熱後易收縮變形的錦綸或滌綸等合成纖維及其混紡物的加工。這些紡織物在染色或印花之前,一般都先在有張力的狀態下用比後續工序為高的溫度進行處理,以防止織物收縮變形。
工業水處理中預處理編輯
定義和組成
沼氣在沼氣池中發酵產生後
氣體預處理
氣體預處理
,裡面會有大量的腐蝕性氣體和對環境造成嚴重污染的氣體(烷類氣體、一氧化碳、二氧化碳、硫化氣體等),對於發電機組和環境都是不能接受的,賓士預處理系統主要是為了保證燃氣發電機組能夠正常穩定的運行而設計生產的,沼氣經過預處理系統後可以大大降低硫化物、水分及顆粒度。
在工業用水處理中,預處理工序的任務是將工業用水的水源——地表水、地下水或城市自來水處理到符合後續水處理裝置所允許的進水水質指標,從而保證水處理系統長期安全、穩定地運行,為工業生產提供優質用水。
預處理的對象主要是水中的懸浮物、膠體、微生物、有機物、游離性余氯和重金屬等。這些雜質對於電滲析、離子交換、反滲透、鈉濾等水處理裝置會產生不利的影響。 [4]
(一)懸浮物
在離子交換水處理中,進水的懸浮物會附著於交換劑顆粒表面,降低交換容量。
在電滲析水處理中,進水的懸浮物會黏附在膜表面上,成為離子遷移的障礙,增加膜電阻。
在鈉濾、反滲透中,進水的懸浮物會堵塞膜的微孔,使透水率下降。
(二)有機物
在離子交換水處理中,有機物會污染陰離子交換樹脂,使其交換容量下降,再生劑耗量增大,樹脂使用壽命縮短。
在電滲析水處理中,水中帶極性有機物被膜吸附後,會改變膜的極性,並使膜的選擇透過性降低,膜電阻增加。
在反滲透、鈉濾水處理中,有機物、膠體、懸浮物容易堵塞反滲透、鈉濾膜的微孔,使透水率很快下降。
(三)微生物
水中的細菌轉移到電滲析膜,在膜面上繁殖,會使膜電阻增加。
細菌、微生物對醋酸纖維素反滲透、納濾膜有侵蝕作用。細菌繁殖會污染膜。
(四)游離性余氯
游離性余氯會使陽離子交換樹脂或離子交換膜活性基團氧化分解,引起樹脂或膜結構破壞。還會使反滲透聚醯胺膜性能惡化。
(五)鐵、錳離子
鐵、錳離子易被離子交換樹脂吸附,且不易被再生劑取代,降低交換容量。也會使電滲析膜污染、中毒。鐵、錳金屬氧化物,其含量高時,在反滲透、納濾膜表面易形成氫氧化物膠體,產生沉澱作用。
由於上述種種不利的影響,導致工業用水處理系統產水量減少,出水的水質下降,工作周期縮短,消耗指標上升,制水成本提高,樹脂和膜的使用壽命縮短,並在操作管理上增加麻煩。
隨著工農業的不斷發展,城市人口的日益密集,有些污水未經處理排入江河,使水中有害物質日益增多。這就對工業用水的預處理提出了更高的要求。
Ⅳ 什麼是 CSS 預處理器 與 後處理器
預處理嫌梁器就芹姿運是編譯css,以前css都是靜態的,要寫兩個class就得寫兩個class,現在可以加入變數。預處理器會對變數做處理。
後處理器就冊輪是對css加入一些擴展,增強css的兼容性。
Ⅳ css預處理器是什麼
css預處理器用來定義一種新的語舉滲言,完全兼容css語法,它為css增加了一些編程的特性,比如變數、函數、邏輯控制。css預處理器編寫的css不能直接正纖脊豎空被瀏覽器識別,需要編譯生成css文件。
Ⅵ 什麼是php預處理器,說明解釋執行與編譯執行
PHP(外文名:PHP: Hypertext Preprocessor,中文名:「超文本預處理器」)是一種通用開源腳本語言。語法吸收了C語言、Java和Perl的特點,利於學習,使用廣泛,主要適用於Web開發領域。PHP 獨特的語法混合了C、Java、Perl以及PHP自創的語法。它可以比CGI或者Perl更快沒衫速地執行動態網頁。用PHP做出的動態頁面與其他的編程語言相比,PHP是將程序嵌入到HTML(標准通用標記語言下的一個應用)文檔中去執行,執行枯陸腔效率比完全生成HTML標記的CGI要高許多;PHP還可以執行編譯後代碼,編譯可以達悉緩到加密和優化代碼運行,使代碼運行更快。
Ⅶ css預處理器有哪些
CSS(Cascading Style Sheet)被譯為級聯樣式表,做為一名前端從業人員來說,這個專業名詞並不陌生,在行業中通常稱之為「風格樣式表(Style Sheet)」,它主要是用來進行網頁風格設計的。通過設立樣式表,可以統一地控制HTML(XHTML)中各標簽的顯示屬性。可以使人更能有效的控制Web頁面(或Web應用程序)外觀,可以精確指定Web元素位置,外觀以及創建特殊效果的能力。CSS擁有對網頁對象和模型樣式編輯能力,並能夠進行初步交互設計,是目前基於文本展示最優秀的表現設計語言。CSS能夠根據 不同使用者的理解能力,簡化或者優化寫法,針對各類人群有較強的易讀性。
就CSS本身而言,對於大多數Web前端從業人員來說就不是問題。學過CSS的人都知道,它不是一種編程語言。你可以用它開發網頁樣式,但是沒法用它編程。換句話說,CSS基本上是設計師的工具,不是程序員的工具。在程序員的眼裡,CSS是很頭痛的事情,它並不像其它程序語言,比如說PHP、Javascript等等,有自己的變數、常量、條件語句以及一些編程語法,只是一行行單純的屬性描述,寫起來相當的費事,而且代碼難易組織和維護。
很自然的,有人就開始在想,能不能給CSS像其他程序語言一樣,加入一些編程元素,讓CSS能像其他程序語言一樣可以做一些預定的處理。這樣一來,就有了「CSS預處器(CSS Preprocessor)」。
一、什麼是CSS預處器
CSS預處理器定義了一種新的語言,其基本思想是,用一種專門的編程察緩語言,為CSS增加了一些編程的特性,將CSS作為目標生成文件,然後開發者就只要使用這種語言進行編碼工作。通俗的說,CSS預處理器用一種專門的編程語言,進行Web頁面樣式設計,然後再編譯成正常的CSS文件,以供項目使用。CSS預處理器為CSS增加一些編程的特性,無需考慮瀏覽器的兼容性問題,例如你可以在CSS中使用變數、簡單的邏輯程序、函數等等在編程語言中的一些基本特性,可以讓你的CSS更加簡潔、適應性更強、可讀性更佳,更易於代碼的維護等諸多好處。
CSS預處理器技術已經非常的成熟,而且也涌現出了很多種不同的CSS預處理器語言,比如說:Sass(SCSS)、LESS、Stylus、Turbine、Swithch CSS、CSS Cacheer、DT CSS等。如此之多的CSS預處理器,那麼「我應該選擇哪種CSS預處理器?」也相應成了最近網上的一大熱門話題,在Linkedin、Twitter、CSS-Trick、知呼以悉蠢及各大技術論壇上,很多人為此爭論不休。相比過計我們對是否應該使用CSS預處理器的話題而言,這已經是很大的進步了。
到目前為止,在眾多優秀的CSS預處理器語言中就屬Sass、LESS和Stylus最優秀,討論的也多,對比的也多。本文將分別從他們產生的背景、安裝、使用語法、異同等幾個對比之處向你介紹這三款CSS預處理器語言。相信前端開發工程師會做出自己的選擇——我要選擇哪款CSS預處理器。
二、Sass、LESS和Stylus背景介紹
為了能更好的了解這三款流行的CSS預處理器,我們先從其背景入手,簡單的了解一下各自的背景信息。
1.Sass背景介紹
Sass是對CSS(層疊樣式表)的語法的一種擴充,誕生於2007年,最早也是最成熟的一款CSS預處理器語言,它可以使用變數、常量、嵌套、混入、函數等功能,可以更有效有彈性的寫出CSS。Sass最後還是會編譯出合法的CSS讓瀏覽器使用,也就是說它本身的語法並不太容易讓瀏覽器識別,因為它不是標準的CSS格式,在它的語法內部可以使睜沒陪用動態變數等,所以它更像一種極簡單的動態語言。
其實現在的Sass已經有了兩套語法規則:一個依舊是用縮進作為分隔符來區分代碼塊的;另一套規則和CSS一樣採用了大括弧({})作為分隔符。後一種語法規則又名SCSS,在Sass3之後的版本都支持這種語法規則。
2.LESS的背景介紹
2009年開源的一個項目,受Sass的影響較大,但又使用CSS的語法,讓大部分開發者和設計師更容易上手。LESS提供了多種方式能平滑的將寫好的代碼轉化成標準的CSS代碼,在很多流行的框架和工具中已經能經常看到LESS的身影了(例如Twitter的Bootstrap框架就使用了LESS)。
根據維基網路上的介紹,其實LESS是Alexis Sellier受Sass的影響創建的一個開源項目。當時SASS採用了縮進作為分隔符來區分代碼塊,而不是CSS中廣為使用的大括弧({})。為了讓CSS現有的用戶使用起來更佳方便,Alexis開發了LESS並提供了類似CSS的書寫功能。
3.Stylus背景介紹
Stylus,2010年產生,來自於Node.js社區,主要用來給Node項目進行CSS預處理支持,在此社區之內有一定支持者,在廣泛的意義上人氣還完全不如Sass和LESS。
Stylus被稱為是一種革命性的新語言,提供一個高效、動態、和使用表達方式來生成CSS,以供瀏覽器使用。Stylus同時支持縮進和CSS常規樣式書寫規則。
註:Stylus上下載Ruby安裝文件(隨意選擇一個版本),此處選擇的是最新版本Ruby1.9.3-p385:
除了使用Ruby的Command控制面板轉譯Sass之外還可以考慮第三方工具,比如說有名的Compass.app和fire.app。
2.LESS文件的轉譯成CSS文件
LESS文件的轉譯和Sass文件轉譯可以說是大同小異,不同之處是LESS在安裝的Node JS環境下通過其自己的命令來進行轉譯。
$ lessc style.less
上面的命令會將編譯的CSS傳遞給stdout,你可以將它保存到一個文件中:
$ lessc style.less > style.css
除了上面的命令轉譯LESS源文件之外,現在還有很多第三方開發的工具,比較常見的有:SimpleLess、Less.app、LESS編譯輔助腳本-LESS2CSS、WinLess和CodeKit.app等,我個人現在常用的是WinLess工具,簡單易用,不過在IOS系統下LESS.app和CodeKit.app很好用。
3.Stylus源文件轉譯成CSS文件
Stylus具有可執行性,因此Stylus能將自身轉換成CSS。Stylus可以讀取自「stdin」輸出到「stdout」,因此Stylus可以像下面轉譯源文件:
$ stylus –compress <some.styl> some.css
Stylus也像Sass一樣,同時接受單個文件和整個目錄的轉譯。例如,一個目錄名為「css」將在同一個目錄編譯並輸出「.css」文件。
$ stylus css
下面的命令將輸出到「./public/stylesheets」:
$ stylus css –out public/stylesheets
還可以同時轉譯多個文件:
$ stylus one.styl two.styl
如果你的瀏覽器安裝了Firebug,那麼可以使用FireStylus擴展。
$ stylus –firebug <path>
五、Sass、LESS和Stylus的語法
每一種語言都有自己一定的語法規則,CSS預處理器語言也不例外,在真正使用CSS預處器語言之前還有一個不可缺少的知識點,就是對語法的理解。值得慶幸的是,這三款CSS預處理器語言的語法和CSS語法都差不多。
1.Sass語法
Sass3.0版本開始使用的是標準的CSS語法,和SCSS可以說是一樣的。這樣Sass代碼轉換成CSS代碼變得更容易。默認Sass使用「.scss」擴展名。Sass語法規則可以像CSS那樣書寫:
/*style.sass新版語法規則*/h1{ color:#936;
background-color:#333;}
正如你所看到的,在Sass樣式中,這樣的代碼是在簡單不過的了。
重要的一點是,Sass也同時支持老的語法,老的語法和常規的CSS語法略有不同,他需要嚴格的語法,任何的縮進和字元的錯誤都會造成樣式的編譯錯誤。Sass可以省略大括弧({})和分號(;),完全依靠嚴格的縮進和格式化代碼,而且文件使用「.sass」擴展名,他的語法類似於:
/*style.sass*/h1
color:#936
background-color: #333
2.LESS語法
LESS是CSS的一種擴展形式,它並沒有閹割CSS的功能,而是在現有的CSS語法上,添加了很多額外的功能。就語法規則而言,LESS和Sass一樣,都是使用CSS的標准語法,只是LESS的源文件的擴展名是「.less」,其基本語法類似於:
/*style.less*/h1 { color: #963;
background-color: #333;}
3.Stylus語法
Stylus的語法花樣多一些,它的文件擴展名是「.styl」,Stylus也接受標準的CSS語法,但是他也像Sass老的語法規則,使用縮進控制,同時Stylus也接受不帶大括弧({})和分號的語法,如下所示:
/*style.styl*//*類似於CSS標准語法*/h1 { color: #963;
background-color:#333;}/*省略大括弧({})*/h1
color: #963; background-color: #333;/*省略大括弧({})和分號(;)*/h1
color:#963
background-color:#333
在Stylus樣式中,你也可以在同一個樣式文件中使用不同的語法規則,下面這樣的寫法也不會報錯:
/*style.styl*/h1 {
color #963}
h2
font-size:1.2em
六、Sass、LESS和Stylus特性
這三款CSS預處理器語言具有一些相同的特性,例如:變數、混入、嵌套、函數等。在這一節中,我們依次來對比一下這三款CSS預處理器語言各種特性的異同之處,以及使用方法。
1.變數(Variables)
如果你是一個開發人員,變數應該是你最好朋友之一。在CSS預處理器語言中你也可以聲明變數,並在整個樣式表中使用。CSS預處理器語言支持任何變數(例如:顏色、數值、文本)。然後你可以在任意地方引用變數。
a)Sass的變數
Sass聲明變數必須是「$」開頭,後面緊跟變數名和變數值,而且變數名和變數值需要使用冒號(:)分隔開。就像CSS屬性設置一樣:
/*聲明變數*/$mainColor: #963;$siteWidth: 1024px;$borderStyle: dotted;/*調用變數*/ | /*轉譯出來的CSS*/------------------------------------------+------------------------------
body { | body {
color: $mainColor; | color: #963;
border:1px $borderStyle $mainColor; | border:1px dotted #963;
max-width: $siteWidth; | max-width: 1024px;
} | }
b)LESS的變數
LESS樣式中聲明變數和調用變數和Sass一樣,唯一的區別就是變數名前面使用的是「@」字元:
/*聲明變數*/@mainColor: #963;@siteWidth: 1024px;@borderStyle: dotted;/*調用變數*/ | /*轉譯出來的CSS*/----------------------------------------+-------------------------------
body { | body {
color: @mainColor; | color:#963;
border:1px @borderStyle @mainColor; | border:1px dotted #963;
max-width: @siteWidth; | max-width:1024px;
} | }
c)Stylus的變數
Stylus樣式中聲明變數沒有任何限定,你可以使用「$」符號開始。結尾的分號(;)可有可無,但變數名和變數值之間的等號(=)是需要的。有一點需要注意的是,如果我們使用「@」符號開頭來聲明(0.22.4)變數,Stylus會進行編譯,但其對應的值並不會賦值給變數。換句話說,在Stylus中不要使用「@」符號開頭聲明變數。Stylus中調用變數的方法和LESS、Sass是完全相同的。
/*聲明變數*/mainColor = #963;siteWidth = 1024px;$borderStyle = dotted;/*調用變數*/ | /*轉譯出來的CSS*/----------------------------------------+--------------------------------
body | body {
color mainColor | color: #963;
border 1px $borderStyle mainColor | border:1px dotted #963
max-width siteWidth | max-width:1024px;
| }
Stylus還有一個獨特功能,不需要分配值給變數就可以定義引用屬性:
/*水平垂直居中*/ | /*轉譯出來的CSS*/------------------------------------+------------------------------------#logo | #logo {
position absolute | position:absolute;
top 50% | top:50%;
left 50% | left:50%;
width w = 150px | width:150px;
height h = 80px | height:80px;
margin-left -(w / 2)