CSS的多層描邊字體效果可以讓文本看起來更加突出,增加閱讀體驗。下面介紹如何使用該效果。
{ text-shadow: 0.05em 0.05em 0 #000, -0.05em -0.05em 0 #000, 0.05em -0.05em 0 #000, -0.05em 0.05em 0 #000; color: #fff; }
在上面的代碼中,我們使用CSS的text-shadow屬性為文本添加描邊。該屬性的值由四組參數構成,每組參數包含了左偏移量、上偏移量、模糊值和顏色。
0.05em 0.05em 0 #000, -0.05em -0.05em 0 #000, 0.05em -0.05em 0 #000, -0.05em 0.05em 0 #000;
在上面的代碼中,我們使用四組參數分別對文本進行四層描邊。第一組參數表示向右下方偏移0.05em,第二組參數表示向左上方偏移0.05em,第三組參數表示向右上方偏移0.05em,第四組參數表示向左下方偏移0.05em。
為了使文本看起來更加突出,我們需要將原來的文本顏色設置為白色。
color: #fff;
通過以上的CSS代碼,我們就實現了多層描邊字體效果。