在來複習一下css預編譯

2022-07-20 02:57:13 字數 1701 閱讀 5634

其實css預編譯很簡單,而且可以做到動態傳參,使用變數等,超級方便,但是不經常使用,是會生疏的,所以一下就來擼一下@mixin,%,@function及他們的用法:

名稱傳參

呼叫方式

產生樣式的存在方式

@mixin

yes@include

以複製拷貝的方式%no

@extend

以組合申明的方式

@mixin的使用方法:

_mixin.scss

@mixin center_block

style.scss

@import 『_mixin』;

#header

.gallery

@mixin引數簡單版

@mixin float ($float:left)

呼叫的例子:

.fl

.fr

多個引數的@mixin

@mixin disabled(¥bgcolor:#e6e6e6,$textcolor :#bababa)

乙個屬性是可以有多個屬性值的,只不過在傳參的時候加上…

@mixin box-shadow($shadow)

應用:.shadow2

第二個不能執行的原因是為box-shadow設定了兩個值,乙個外影音乙個內陰影,並且是以,分開的,實際情況是得在傳遞的引數後面加上…

@mixin box-shadow($shadow…)

@mixin header

呼叫:@include header

解析後的css :

#header

#header .logo

%例項:

%center-block

#header

.gallery

解析成的css:

#header , .gallery

#header

.gallery

$lte7:true;

%clearfix

如果哪個要呼叫這個,直接@extend:

.wrap

-首先%定義的站位選擇器樣式不能傳遞引數,當然注意不能傳遞引數,不代表樣式裡不能使用變數

-然後@extend呼叫%宣告的東西時,必須要把%帶上,@extend %clearfix是正確的,而@extend clearfix是錯誤的呼叫

-最後%定義的樣式,如果不呼叫是不會產生任何樣式的,這也是用%定義樣式比原先用class方法定義的好處所在

@function與@mixin,%的不同點在於本身就有一些內建的函式,方便我們使用,如color函式

舉例:內建的darken函式:

darken($f00,50%)本身作為屬性值:

$reddark:darken($f00,50%)!default

p函式總結:

rgba

ie-hex-str

darken

lighten

percentage

length

nthunit

unitless

三目判斷if($condition,$if-true,$if-false)

單純的梳理知識點是缺少靈性的,所以要注重在專案中應用,達到,熟練使用,舉一反三的程度是最好的。

關於預編譯就寫這麼多,以後具體在專案中用到了(其實以前就用到過了,只不過熟練度還不夠)在繼續完善,學無止境,再接再厲。

來,複習一下,基礎執行緒

什麼是程序?當乙個程式開始執行時,它就是乙個程序,程序包括執行中的程式和程式所使用到的記憶體和系統資源。而乙個程序又是由多個執行緒所組成的。什麼是執行緒?執行緒是程式中的乙個執行流,每個執行緒都有自己的專有暫存器 棧指標 程式計數器等 但 區是共享的,即不同的執行緒可以執行同樣的函式。什麼是多執行緒...

MySQL 四種隔離級別,來複習一下吧

sql標準定義了4類隔離級別,包括了一些具體規則,用來限定事務內外的哪些改變是可見的,哪些是不可見的。低階別的隔離級一般支援更高的併發處理,並擁有更低的系統開銷。read uncommitted 讀取未提交內容 在該隔離級別,所有事務都可以看到其他未提交事務的執行結果。本隔離級別很少用於實際應用,因...

也來複習一下資料庫的一些知識1

1 資料庫型別 層次性資料庫 網路式資料庫和關係式資料庫 2 資料庫語言 1 ddl data definition language 資料庫定義語言 如 drop alter create 用於定義資料庫結構 基本表 檢視等。2 dml data manipulation language 資料庫...