某些字体有轮廓和填充的变体,如果您在重叠的文本上使用它们,它会在填充的文本上绘制轮廓或阴影笔划。这与像 -webkit-text-stroke-color 这样的文本的描边不同,因为有时填充的字体包含阴影或其他细节。
以下是一些旨在以这种方式使用的字体示例。
http://www.myfonts.com/fonts/matchandkerosene/duotone/
http://www.myfonts.com/fonts/scrowleyfonts/stomp/
我有点能够使用这样的CSS来让它工作:
这将创建两个 H1 跨度,并使用上边距将轮廓移到填充轮廓的顶部。
但是,这对我来说似乎并不理想。两个问题:
- 我不想复制 html 中的文本。
- 我必须通过反复试验来猜测最高利润。
- 如果文本换行,这将不再起作用。
有一个更好的方法吗?我可以忍受必须复制文本,但我真的想要一种更自动的方式来进行定位。
谢谢!