不使用font-weight等CSS实现文字变瘦或变胖效果
💡
原文中文,约2100字,阅读约需5分钟。
📝
内容提要
本文介绍了使用SVG滤镜中的feMorphology实现文字变细的方法,feMorphology滤镜可以对图形进行侵蚀或扩张,实现文字变瘦或加粗的效果。文章提供了相关代码和滤镜语法说明,并预告了下篇文章将介绍无JavaScript的图片马赛克技术。
🎯
关键要点
- 本文介绍了使用SVG滤镜中的feMorphology实现文字变细的方法。
- feMorphology滤镜可以对图形进行侵蚀或扩张,实现文字变瘦或加粗的效果。
- 使用SVG的feMorphology滤镜可以避免CSS描边属性的限制,提供更好的文字变细技术实现。
- 具体代码包括插入SVG滤镜定义和相应的CSS样式。
- feMorphology滤镜支持三个属性:in、operator和radius,分别用于输入图像、滤镜算法和侵蚀或扩张的尺寸。
- 应用erode和dilate效果后,图像的视觉表现和尺寸会发生变化。
- 文章最后预告了下篇文章将介绍无JavaScript的图片马赛克技术。
➡️