国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

Sass & Compass 初步使用

boredream / 3606人閱讀

摘要:一需安裝的東西自帶可能被墻查看安裝情況查看的可參考資料如何安裝,使用鏡像二實操使用終端進入選定的目錄初始化編寫針對可能用到的命令可能用到的命令針對進入到特定目錄后,輸入命令方式方式,會創建一個以命名的目錄是目錄的配置文件,可根據個人

一、需安裝的東西

ruby(mac自帶)

gem(sources可能被墻)

sass

compass

查看安裝情況:

ruby -v
gem -v
sass -v
compass -v

查看 gem 的 sources:

gem sources

可參考資料

如何安裝 Ruby、Sass、Compass(Windows,使用 Ruby China 鏡像)

二、實操

使用終端進入選定的目錄

compass 初始化

sass 編寫

針對1:

mac可能用到的命令:

cd xxx
ls

win可能用到的命令:

E:
cd xxx
dir

針對2:

進入到特定目錄后,輸入命令:

compass init    // 方式1
compass create [project_name]    // 方式2,會創建一個以project_name命名的compass目錄

config.rb是compass目錄的配置文件,可根據個人需求修改(重要)

針對3:

體驗sass的強大吧(與css比較)

// reset
@import "compass/reset";

// css3圓角
@import "compass/css3";
.box{
    @include border-radius(5px);
}

// css3漸層
.box{
    @include background(linear-gradient(lighten(red, 20%), red)); 
}

// sprite
@import "icons/*.png";
@include all-icons-sprites;  //all-后面的‘icons’代表文件夾名字

compass會監測目錄下文件變動而進行實時編譯(可能需要watch一下)

可參考資料:

用強大的compass+sass寫css

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/116464.html

相關文章

  • Intellij IDEA & Sass 使用記錄匯總

    摘要:在安裝插件很容易,在通用設置窗口里面,選擇節點,輸入搜索相關插件名稱即可。參考鏈接徹底解決卡頓七解決中文注釋錯誤問題問題描述控制臺報錯,類似于報錯。排查發現是由于中文注釋引起。 一、如何查看某端口被占用進程并將其殺死 終端輸入以下命令,將會出現占用端口的進程信息: lsof -i tcp:[port] // port 為所占用的端口,如:8086 找到進程的 PID,使用 kil...

    CodeSheep 評論0 收藏0
  • Compass創建者Chris Eppstein:真正的CSS框架是如何工作的

    摘要:當我的補丁被拒絕了之后,我想要指出一個方向真正的框架是如何工作的。發起這項捐助有我的個人原因在里面,我的父親在年被確診為患有一種罕見的成年人形式的線粒體疾病。正是一個經歷了如此過程的產品。 非商業轉載請注明作譯者、出處,并保留本文的原始鏈接:http://www.ituring.com.cn/article/120792 Chris Eppstein,Compass框架的創建...

    BigTomato 評論0 收藏0
  • 前端利器:SASS基礎與Compass入門

    摘要:在吸取了的一些特性基礎上,有了大幅改進,也就是現在的。嵌套極大程度上降低了選擇器名稱和屬性的重復書寫。選擇器嵌套選擇器嵌套是指從一個選擇器中嵌套子選擇器,來實現選擇器的繼承關系。也已經成為的一個標配組件。 SASS是Syntactically Awesome Stylesheete Sass的縮寫,它是css的一個開發工具,提供了很多便利和簡單的語法,讓css看起來更像是一門...

    娣辯孩 評論0 收藏0
  • 使用compass自動合并css雪碧圖(css sprite)

    摘要:使用雪碧圖,能夠減少頁面的請求數降低圖片占用的字節,以此來達到提升頁面訪問速度的目的。也正是因為這一點,導致很多開發者懶于使用雪碧圖。本文就介紹下怎樣使用來自動合并雪碧圖。生成的每個雪碧圖默認的規則是目錄名圖片名。 css雪碧圖又叫css精靈或css sprite,是一種背景圖片的拼合技術。使用css雪碧圖,能夠減少頁面的請求數、降低圖片占用的字節,以此來達到提升頁面訪問速度的目的。但...

    劉永祥 評論0 收藏0
  • 前端入門23-CSS預處理器(Less&Sass

    摘要:聲明聲明本篇內容梳理自以下幾個來源網站的文檔中文網感謝大佬們的分享。這個時候,預處理器就出現了,其實應該是說和這類語言出現了。聲明 本篇內容梳理自以下幾個來源: Github:smyhvae/web Bootstrap網站的 less 文檔 Sass中文網 感謝大佬們的分享。 正文-CSS預處理(less&Sass) CSS預處理 什么是 CSS 預處理?為什么要有 CSS 預處理? 這...

    freecode 評論0 收藏0

發表評論

0條評論

boredream

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<