DEV Community
·
让描边文本更迷人，不用CSS。想改变这一现状吗？
原文英文，约300词，阅读约需1分钟。
📝
内容提要
在CSS中实现描边文本较难，因为现有属性在不同浏览器中不一致，且缺乏描边对齐功能。相比之下，SVG效果更一致。W3C的CSS填充和描边模块规范可能解决这些问题，我已提交提案给Interop 2025。
🎯
关键要点
-
在CSS中实现描边文本较难，现有属性在不同浏览器中不一致。
-
现有的非标准属性(-webkit-text-stroke等)规范基本，浏览器实现不一致。
-
paint-order属性存在bug，无法控制描边和填充的层叠顺序。
-
CSS中缺乏描边对齐功能，导致难以获得理想效果。
-
设计工具如Figma中有描边对齐功能，但CSS无法实现。
-
SVG提供了更一致和可控的描边文本效果，但不理想。
-
W3C的CSS填充和描边模块规范可能解决这些问题。
-
已向Interop 2025提交提案，希望能看到这些问题的解决。
❓
延伸问答
为什么在CSS中实现描边文本比较困难？
在CSS中实现描边文本困难是因为现有属性在不同浏览器中不一致，且缺乏描边对齐功能。
SVG与CSS在描边文本效果上有什么区别？
SVG提供了更一致和可控的描边文本效果，而CSS的实现则不理想且不一致。
W3C的CSS填充和描边模块规范有什么作用？
W3C的CSS填充和描边模块规范可能解决CSS中描边文本实现的各种问题。
为什么设计工具如Figma能实现描边对齐，而CSS不能？
设计工具如Figma具备描边对齐功能，而CSS缺乏这一功能，导致难以获得理想效果。
目前CSS中有哪些非标准属性用于描边文本？
-webkit-text-stroke等非标准属性用于描边文本，但其规范基本且实现不一致。
我如何参与Interop 2025的提案？
你可以通过支持提案来参与Interop 2025，表达希望解决CSS描边文本问题的愿望。
🏷️
