如何使用 span 和 css 在文本 ABC 后面重现这种下划线?
我已经能够做下划线below嵌套的文本span
和彩色的border-bottom
,但无法获取behind图像和above文本基线。
<p style='font-size:100px'>
<span style='border-bottom:30px magenta solid'><span>A</span></span>
<span style='border-bottom:60px magenta solid'><span>B</span></span>
<span style='border-bottom:90px magenta solid'><span>C</span></span>
</p>
另一种可能性:
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>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)