时间戳

首页 > 解决方案 > font-size: 退出 WordPress 后浏览器将不再识别钳位 (..)

css - font-size: 退出 WordPress 后浏览器将不再识别钳位 (..)

问题描述

对于一个新的 WordPress 主题，我使用流体排版（https://fluid-typography.netlify.app）来相应地缩放字体。在以管理员身份登录的开发过程中，一切正常。一旦我退出 WordPress 并查看页面，浏览器突然无法识别字体大小的“clamp(...)”值（无效的属性值）并使用回退。这可能是什么原因？

font-size: 4.0625rem; /* <- used as fallback, when I am not logged in */
font-size: min(max(1.75rem,3.3vw+1rem),4.0625rem);
font-size: clamp(1.75rem,3.3vw+1rem,4.0625rem); /* <- used from the browser when I am logged in */

标签： csswordpressfont-sizeclamp

解决方案

注意：这个答案是虚假的，因为存在语法错误（+ 运算符两侧缺少空格）。看评论。我不知道您的完整 WP 环境，所以只能猜测您对 CSS 进行了一些预处理，因为您的一些表达式不是合法的 CSS。它们需要在 calc 函数中。

这个片段可以做到这一点，它似乎工作正常：

div {
  font-size: 4.0625rem;
  /*  used as fallback, when I am not logged in */
  font-size: min(max(1.75rem, calc(3.3vw + 

> Blockquote

1rem)), 4.0625rem);
  font-size: clamp(1.75rem, calc(3.3vw + 1rem), 4.0625rem);
  /* <- used from the browser when I am logged in */
}
<div>Hello</div>

推荐阅读