less變數插值

2022-03-06 03:13:57 字數 616 閱讀 8195

在使用less的過程中,我在background的中引用路徑,希望先確定乙個baseurl,然後再在url中使用拼接字串的方式拼接,嘗試多次,失敗。 實際上less的變數插值是有自己的一套規則的,如下:

先在less檔案頂部宣告 @picturepath,這樣當檔案路徑發生變化的時候就只需要修改 @picturepath,而不需要在檔案中乙個乙個的修改,大大提高了可擴充套件性。 

@picturepath: '

../../../www/images/

';

然後使用如下的方式使用url:

span.emoji emoji.png");

&:hover emoji-active.png");}}

span.picture picture.png");

background-size: 32px 32px;

&:hover picture-active.png");

background-size: 32px 32px;

}}

即將@後面的變數使用{}括起來,然後整體使用""包裹即可。 這樣,我們寫好了這個路徑即使路徑變化也不用乙個乙個的去修改他們 。 

參考文章: 

sass與less變數 插值 作用域的差異

less是以 開頭的,而sass是以 開頭的。sass num 100px box結果 boxless num 100px box結果 boxless和sass 可以通過插值的方法命名乙個屬性。變數名需要加乙個大括號。less key margin box auto sass的寫法同理 sass只會...

插值查詢 插值搜尋

這是一種和二分比較相似的查詢的演算法,不過不同的是,對於分布比較均勻的較大的陣列,插值查詢有時能夠一次就搜尋到位.為什麼能夠這麼快呢 看網上沒有什麼關於這種演算法的描述,我就來描述一下吧.首先要知道一點,這種搜尋方式只能夠針對順序表進行,再乙個要理解順序表中的乙個特點,在順序表中查詢是否存在乙個值,...

Less變數詳解

普通的變數 css預設不支援變數,當我們使用 less 之後就可以使用。其定義方式是 變數名 值 如下,我們定義乙個變數 green,設定乙個顏色 green,然後將網頁背景設定為綠色 green 801f77 header 注意 由於變數只能定義一次,實際上他們就是 常量 作為選擇器和屬性名 使用...