Magento 2 自定义 css 文件包含

Magento 2 custom css file include

我是 Magento 的新手,使用的是当前版本的 Magento。 2.2.0。

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

我应该把 css 放在哪里,我该如何使用它?

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

摘录如下:

The recommended way to do this is adding an extending default_head_blocks.xml in your theme, and including the required stylesheets in this file.

Your custom default_head_blocks.xml should be located as follows: <theme_dir>/Magento_Theme/layout/default_head_blocks.xml. To include a CSS file, add the <css src="<path>/<file>" media="print|<option>"/> block in <head> section in a layout file. <path> is specified relative to the theme web directory (/web) For example, the following illustrates how stylesheets are included in the default Blank theme:

<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.