我想覆盖 magento2 css 中的默认断点。建议任何想法如何做到这一点?
例如在 magento2 默认断点是
@screen__xxs: 320px;
@screen__xs: 480px;
@screen__s: 640px;
@screen__m: 768px;
@screen__l: 1024px;
@screen__xl: 1440px;
我想通过
覆盖它们@screen__xxs: 320px;
@screen__xs: 479px;
@screen__s: 767px;
@screen__m: 991px;
@screen__l: 1440px;
@screen__xl: 2150px;
在 Devdocs magento 上,我找到了添加新内容但无法覆盖现有所有内容的方法。
最佳答案
在您的主题中,在以下目录结构下创建一个文件:
<Namespace>/<Theme>/web/css/source/lib/variables/_responsive.less
现在在这里添加您的自定义变量:
@screen__xxs: 320px;
@screen__xs: 479px;
@screen__s: 767px;
@screen__m: 991px;
@screen__l: 1440px;
@screen__xl: 2150px;
此文件将覆盖默认的 magento 变量。因此,您将拥有自定义断点。在部署时将创建目录:
pub/static/frontend/<Namespace>/<ThemeName>/en_US/css/source/lib/variables/_responsive.less
您会看到默认断点被覆盖。
关于css - 覆盖 Magento2 中的默认断点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49954222/