如何在 Shopify 主题的特定部分加载 CSS?
P粉752812853
P粉752812853 2023-08-30 09:06:40
[CSS3讨论组]
<p>我正在尝试创建另一个部分并应用资产文件夹中的 CSS。但是当我把 <code>{{ 'style-section-block.css' |资产网址 | stylesheet_tag }}</code> 到我想要应用 CSS 的页面,它也会影响其他部分,即使我只放入我想要更改的部分。</p> <p>我希望能够编辑一个部分页面</p>
P粉752812853
P粉752812853

全部回复(1)
P粉083785014

如果您想应用 CSS 特定部分,请首先向您想要设置样式的部分添加唯一的类或 ID。在 CSS 文件中使用该唯一的类或 ID 后,您可以设置部分的样式。示例是

<div class="my-section">
  <!-- section content -->
</div>

“my-section”是该节的唯一类名。您可以使用该类名称将样式添加到部分。

.my-section {
      font-size: 24px;      
    }

根据 Shopify 主题。您可以根据当前页面句柄或页面模板有条件地使用 CSS 文件。根据我的想法,您可以在主题的“布局”文件中执行此“模板”或“page.handle”变量。我的意思是“theme.liquid”文件。您可以将以下代码添加到“布局”文件的“head”部分。

{% if template contains 'your-specific-template' or page.handle == 'your-specific-page-handle' %}
  {{ 'style-section-block.css' | asset_url | stylesheet_tag }}
{% endif %}

将“您的特定模板”替换为您的模板名称,或将“您的特定页面句柄”替换为您的页面句柄名称。并从其他部分删除 CSS 链接。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号