为什么包含自定义css文件后样式不应用于magento2.2.3

Question

我正在使用magento2.2.3版本在我的磁贴主题中，在以下路径中添加了自定义CSS文件项目/应用/设计/前端/供应商/主题/网络/css/custom.css

并在default_head_blocks.XML文件中添加了源文件。之后，在HTML内容中添加了一个包含以下代码的页面

<div class="freegotest"><span class="tested">count down custom code</span></div>

在custom.css代码中为

.tested { 
    color: red !important; 
    font-size: 20px;
}

通过查看页面源，标题中包含自定义css文件，但样式不适用于文本。

Answer 1

您的XML文件必须命名为default_head_blocks.xml，而不是default_head_blocks.XML。

一旦更改名称，清除缓存和静态文件：

1. 检查是否通过命令行使用开发人员模式

php bin/magento deploy:mode:show

2. 如果开发人员模式设置为production，请尝试重建静态内容

php bin/magento setup:static-content:deploy

3. 在任何情况下（生产或开发人员），清除每个缓存的文件

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento cache:flush;

希望有帮助

Answer 2

从2.1升级到2.3.2之后，我发现我自定义主题中的自定义色板Magento_Swatches / web / css / swatches.css内容的自定义CSS不会合并到引起布局的styles-m.css和styles-l.css产品详细信息页面中的问题。

调查后，我无法确定如何使Magento 2.3.2合并自定义CSS文件到styles-m.css和styles-l.css

因此，我决定为Magento_Swatches创建新的.less文件。我在自定义主题中创建了新文件Magento_Swatches / web / css / source / _module.less，然后移动

的所有内容

Magento_Swatches / web / css / swatches.css

to

Magento_Swatches / web / css / source / _module.less

然后运行命令安装程序：升级

Hozaaaaaay！问题已解决，所有自定义CSS均合并到styles-m.css和styles-l.css中像Magento 2.3.2不允许直接在模块中使用.css]