文字後面的粗底線
底線文字是網頁設計中常用的樣式技術。然而,在文字下方創建一條粗而突出的線條可能具有挑戰性。此問題不僅解決了為文字添加下劃線的挑戰,還解決了將下劃線直接放在文字本身後面的挑戰。
[原始問題]
如何建立一個底線使用跨度和 CSS 出現在文字後面?
[已改進答案]
在文字後面實現粗下劃線的另一種方法是使用框陰影:
p { font-size: 100px; font-family: arial; } span { padding: 0 10px; box-shadow: inset 0 -0.4em 0 0 magenta; } span:nth-child(2) { box-shadow: inset 0 -0.55em 0 0 magenta; } span:nth-child(3) { box-shadow: inset 0 -0.7em 0 0 magenta; }
<p> <span>A</span><span>B</span><span>C</span> </p>
此方法建立一個陰影,給出外觀直接在文字後面畫一條粗線,不會影響文字的位置或內容。
以上是如何使用 CSS Box Shadow 在文字後面建立粗下劃線?的詳細內容。更多資訊請關注PHP中文網其他相關文章!