时间戳

首页 > 解决方案 > 在液体中，“w”和“x”的单位是什么？

liquid - 在液体中，“w”和“x”的单位是什么？

问题描述

我正在修改一些 Shopify Liquid 代码并看到以下对我没有意义的单位：1600x 1600w

我假设“w”指的是宽度，但这些是以像素为单位的吗？然后我不知道“x”指的是什么。

<img  alt="{{ section.settings.image.alt }}"
          {% if section.settings.image != nil %}
            src="{{ section.settings.image | img_url: '100x' }}"
            data-src="{{ section.settings.image | img_url: '2048x' }}"
            class="lazyload lazyload--fade-in hsContainer__image"
            sizes="100vw"
            srcset="  {{ section.settings.image | img_url: '2048x' }} 2048w,
                      {{ section.settings.image | img_url: '1600x' }} 1600w,
                      {{ section.settings.image | img_url: '1200x' }} 1200w,
                      {{ section.settings.image | img_url: '1000x' }} 1000w,
                      {{ section.settings.image | img_url: '800x' }} 800w,
                      {{ section.settings.image | img_url: '600x' }} 600w,
                      {{ section.settings.image | img_url: '400x' }} 400w"
          {% else %}
            src="{{ 'placeholder.svg' | asset_url }}"
            class="hsContainer__image"
          {% endif %}
           />

标签： liquid

解决方案

“w”是指图像的宽度作为 srcset 的参数，如下所述： https ://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#Example_3_Using_the_srcset_attribute

x 用作字符分隔宽度和高度参数，如下所述： https ://help.shopify.com/en/themes/liquid/filters/url-filters#size-parameters

高温高压

推荐阅读