更改Magento 2.0主題中的CSS

我使用Magento Blank作爲父主題。更改Magento 2.0主題中的CSS

我在/app/design/frontend/MYVENDORNAME/MYTHEMENAME/web/css/source/包含此代碼創建_theme.less.css：

@button-primary__background: @color-orange-red1; 
@button-primary__hover__background: @color-orange-red4; 
@button-primary__border: 1px solid @color-orange-red2; 
@button-primary__hover__border: 1px solid @color-orange-red2;

我已清空緩存。

但按鈕仍然是藍色的。

我在做什麼錯？

來源

2016-01-26 Gordova

開始http://devdocs.magento.com/guides/v2.0/frontend -dev引導/ CSS-主題/ CSS-preprocess.html。 –

這段代碼需要進入一個.less文件並被編譯成一個.css文件，因爲這不是可以在css文件中原生讀取的代碼風格。

來源

2016-01-26 19:12:12

首先添加自定義CSS

轉到：

/app/design/frontend/Magento/MYVENDORNAME/MYTHEMENAME/layout/default_head_blocks.xml

而且在頭塊添加CSS是這樣的：

<head><css src="css/custom.css" /></head>

而不是之後在此創建custom.css文件路徑：

/app/design/frontend/Magento/MYVENDORNAME/MYTHEMENAME/web/css/custom.css

運行你的CSS，希望它適合你。

來源

2016-01-27 06:03:01

所有你需要做的就是從複製文件：

/vendor/magento/theme-frontend-blank/web/css/

進入主題目錄：

/app/design/frontend/MYVENDORNAME/MYTHEMENAME/web/css/

你不必將所有的文件，您只需更換你的文件想要進行更改。

我認爲你必須學習LESS才能正確地設計主題風格。但對於簡單的靜態CSS改變了這種可能的工作：

1）添加/dev1/vendor/magento/theme-frontend-blank/web/css/_styles.less具有以下內容：

@import 'source/lib/_lib.less'; // Global lib 
@import 'source/_sources.less'; // Theme styles 
@import 'source/_components.less'; // Components styles (modal/sliding panel) 

body{background:#f00}

來源

2016-01-27 08:59:07 Gordova

更改Magento 2.0主題中的CSS

回答

相關問題