[英]How to add a mobile optimised external CSS to a Shopify site
我想为我的移动优化添加一个外部CSS文档,但是不确定如何执行此操作。
我了解要将文件添加到Shopify主题索引,您必须执行以下操作:
{{ 'style.css' | asset_url | stylesheet_tag }}
在标题中。 但是我不确定如何将其包装在@media
语句中,例如:
@media screen and (device-aspect-ratio: 40/71) {
{{ 'mobile.css' | asset_url | stylesheet_tag }}
}
添加以上内容仅会打印@media screen and (device-aspect-ratio: 40/71) {}
有谁知道在Shopify上使用@media的正确方法?
[更新]这是一种更好的方法,完全省略了sytlesheet_tag
函数:
<link rel='stylesheet' media='screen and (device-aspect-ratio: 40/71)' href='{{ 'mobile.css' | asset_url }}' />
旧:
通常包括资产:
{{ 'mobile.css' | asset_url | stylesheet_tag }}
然后确保将媒体查询放入 mobile.css
文件中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.