系统学习magento二次开发，推荐小册：《Magento中文全栈二次开发 》
本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。
一旦你必须在CompStore中进行更改才能自定义新主题，你可以考虑其他主题中已经可用的功能来应用你的更改。
Magento 2.0根目录下的vendor目录处理所有本地Magento模块和主题。
到目前为止，您一直在研究的Magento blank和Luma主题分别
为invendor/Magento/theme front-end blank
和vendor/Magento/theme Front-end Luma。
因此，CompStore主题“接收”了这些文件夹下主题的所有功能。
修复这些基本概念以理解您在开发Magento主题解决方案时插入的上下文是很重要的。
一旦您对行为有了明确的概念，让我们为CompStore主题创建一个自定义.css文件：
将Packt/vendor/magento/theme-front-end-black/web/css/styles.less
file复制到Packt/app/design/fron-end/Packt/CompStore/web/cslocation
打开复制的文件并插入animport命令，如下例所示：
@import 'source/lib/_lib.less'; @import 'source/_sources.less'; @import 'source/_components.less'; @import 'source/compstore.less';
保存文件。
现在，打开您喜欢的代码编辑器，在packt/app/design/frontend/compstore/web/css/source目录下创建compstore.less文件，
然后键入以下代码：
@color-compstore: #F6F6F6;
body{
background: @color-compstore;
}使用override，让我们通过在packt/app/design/frontend/compstore/web/css/source下创建_theme.less文件来更改产品页面的颜色模式
执行以下操作：
//Change color of elements in Product Page @color-catalog: #4A96AD; @page__background-color: @color-catalog; @sidebar__background-color: @color-gray40; @primary__color: @color-gray80; @border-color__base: @color-gray76; @link__color: @color-gray56; @link__hover__color: @color-gray60; @button__color: @color-gray20; @button__background: @color-gray80; @button__border: 1px solid @border-color__base; @button-primary__background: @color-orange-red1; @button-primary__border: 1px solid @color-orange-red2; @button-primary__color: @color-white; @button-primary__hover__background: darken(@color-orange-red1, 5%); @button-primary__hover__border: 1px solid @color-orange-red2; @button-primary__hover__color: @color-white; @navigation-level0-item__color: @color-gray80; @submenu-item__color: @color-gray80; @navigation__background: @color-gray40; @navigation-desktop-level0-item__color: @color-gray80; @navigation-desktop-level0-item__hover__color: @color-gray34; @navigation-desktop-level0-item__active__color: @navigation-desktop-level0-item__color; @tab-control__background-color: @page__background-color; @form-element-input__background: @color-gray89; @form-element-input-placeholder__color: @color-gray60; @header-icons-color: @color-gray89; @header-icons-color-hover: @color-gray60;