我可以在LESS進口中找到並替換嗎？

我要嵌套一個div內的CSS框架，以提供一個範圍的命名空間是這樣的：我可以在LESS進口中找到並替換嗎？

.myframework { 
    @import url("myframework.css"); 
}

然而，框架有規則<HTML>和<身體>標籤，所以上面的代碼會編譯爲：

.myframework html { ... } 
.myframework body { ... }

這不行。我可以手動更改任何這樣的引用，但是隨後每次對框架進行更新時都必須手動執行此操作。是否有一個相當於查找/替換LESS，我可以申請到一個@import聲明是這樣的：

/* psedudocode */ 
.myframework { 
    str_replace((@import url("myframework.css")), 'html', '.myframework-html'; 
}

這將編譯爲：

.myframework .myframework-html { ... }

的想法是，我可以再範圍框架是這樣的：

<html> 

    <body> 

    No framework styles applied here 

    <div class="myframework"> 
     <div class="myframework-html"> 
     <div class="myframework-body"> 

      Framework styles are applied here 

     </div> 
     </div> 
    </div> 

    </body> 
</html>

此外，我想可能有一些使用正則表達式，以確保只有html和body標籤都受到影響，而不是類名稱，網址（）路徑等

來源

2015-08-29 Matt

我個人使用SASS，但我還沒有解決一個框架（bootstrap，semantic-ui等），所以我對兩個解決方案感興趣。但是，我總是可以從LESS編譯，然後在編譯的CSS上執行SASS查找/替換（反之亦然，對於基於SASS的框架）。 – Matt

好吧，讓我們繼續使用LESS，因爲Bootstrap和Semantic-UI都基於LESS。我會修改這個問題，使之更具體到LESS。 – Matt

這種預處理有點超出了CSS預處理器的目的（因爲它們主要是爲了創建新的CSS樣式而不是爲了破解現有的CSS代碼* ......至少Less是最少的「字符串/文本處理」之一所以確保「預處理器」一詞不會誤導你）。 –

雖然沒有少，這可能是一個更好的解決方案：https://www.npmjs.com/package/grunt-css-selectors

這咕嚕插件將前綴包含.foo添加到所有的CSS選擇器，但HTML /體選擇將包含.foo點來代替。這樣，我可以從LESS或SASS進行編譯，然後分別運行前綴命令。

來源

2015-08-29 13:41:14 Matt

我可以在LESS進口中找到並替換嗎？

回答

相關問題