CSS实现文字描边方法总结

 浆糊之家   2018-05-06 23:59   414 views 热度值

方法一:利用多层文字阴影text-shadow

不够理想。

  • 最细的描边是跟号2(约等于1.414)px宽度的描 边,如果希望描边越宽,需要更多层的阴影来实现,这可能导致性能消耗大的问题。
  • 同时,描边会有缺角,并不是完全包裹,在描边越宽的情况下越明显。

方法二(推荐):使用属性-webkit-text-stroke

-webkit-text-stroke是应用于文字的描边特性的属性,尚未列入正式标准。
是以下属性的简写:

需要额外的修正。

  • 兼容性:需要-webkit-前缀支持。
  • 描边是同时向内外延展的,描边越大,字的内容越少,所以需要多覆盖一层文字来修正。

 

 

 

PREVIOUS:已经是最后一篇了

 发表评论


表情