当前位置: 首页 > news >正文

CSS 中 letter-spacing 不支持百分比

Bug描述

  • 问题现象:字体之间的间距过大,与设计稿不一致
  • 影响范围:某一段字段的间距过大
  • 复现步骤:直接打开页面

原因分析

  • 根本原因:figma 中 letter-spacing: 2%,再CSS中不支持百分比的值,于是我改成了letter-spacing: 2px
  • 在这里插入图片描述
  • 相关代码styles.css中的letter-spacing: 2px;

修复过程

  • 修复方案:删除letter-spacing: 2px;
  • 测试验证
  • 在这里插入图片描述

经验总结

  • 教训:需要验证页面样式与设计稿是否一致
  • 改进措施
    1. figma 中的CSS样式,复制过来后,需要验证css样式是否生效
    1. 如CSS中不支持figma给的样式,调整样式后,需要验证页面和设计稿的一致性

后续跟进

  • 监控:无
  • 反馈收集:无

相关文章:

  • UniApp 表单校验两种方式对比:命令式与声明式
  • Perl语言的计算机网络
  • 【后端开发面试题】每日 3 题(二十)
  • 【CSS】CSS 使用全教程
  • 【学习记录】大模型微调之使用 LLaMA-Factory 微调 Qwen系列大模型,可以用自己的数据训练
  • [01-03-03].第15节:面向对象 - 三大特征
  • PL/SQL语言的扩展运算符
  • C/C++中的条件编译指令#if
  • LVS-DR模式配置脚本
  • LeetCode 热题 100----2.移动零
  • Grid 布局:从入门到精通,一篇就够了—— 探索最强大的 CSS 布局系统
  • (C语言)习题练习 (sizeof和strlen)
  • 关于功耗检测功能开发笔记
  • Python字符串对齐哲学探微与东方字符补偿算法(授权DeepSeek撰写)
  • uniapp生命周期vue生命周期有何异同?
  • XDP/eBPF来包过滤-已上机验证
  • UniApp 生命周期钩子的应用场景
  • es6什么是暂时性死区,为何会存在
  • 买卖股票的最佳时机(js实现,LeetCode:121)
  • 大模型tokenizer重构流程
  • 浙江推动人工智能终端消费:家居机器人纳入以旧换新补贴范围
  • 上海公办小学验证今起开始,下周一和周二分区进行民办摇号
  • 东部沿海大省浙江,为何盯上内河航运?
  • 马上评|文玩字画竞拍轻松赚差价?严防这类新型传销
  • 江苏省委组织部副部长高颜已任南京市委常委、组织部部长
  • 马上评|中学生被操场地面烫伤,谁的“大课间”?