Magento 2 自定义 css 文件包括

debugcn 发表于 Dev

阿亚兹

我是 Magento 的新手并使用当前版本的 Magento ie。2.2.0.

我有我需要在网站中调用的自定义 css 文件，但问题是我不知道在哪里保存该 css 文件或如何调用该文件。

我在哪里放置 css，以及如何使用它？

乔

文档能够回答这个问题。请参阅此处：http : //devdocs.magento.com/guides/v2.0/frontend-dev-guide/css-topics/css-themes.html。

这是它的摘录：

推荐的方法是在您的主题中添加扩展 default_head_blocks.xml，并在此文件中包含所需的样式表。

您的自定义 default_head_blocks.xml 应位于如下位置：<theme_dir>/Magento_Theme/layout/default_head_blocks.xml。要包含 CSS 文件，请在布局文件中添加<css src="<path>/<file>" media="print|<option>"/>块 in<head>部分。<path>是相对于主题 web 目录 (/web) 指定的，例如，以下说明了如何将样式表包含在默认的空白主题中：

<Magento_Blank_theme_dir>/Magento_Theme/layout/default_head_blocks.xml

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="css/styles-m.css" />
        <css src="css/styles-l.css" media="screen and (min-width: 768px)"/>
        <css src="css/print.css" media="print" />
    </head>
</page>

如果您使用 Luma 主题，您可以直接编辑它，但最好创建自己的主题来扩展它并在那里添加 css。请参阅此处：http : //devdocs.magento.com/guides/v2.0/frontend-dev-guide/themes/theme-create.html。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。