<p class="u-line">テキストに下線を付けます</p>
<p class="line">テキストに下線を付けます</p>
<p><span class="line">下線</span>をつけようと思います</p>
.u-line {
text-decoration: underline;
}
.line {
position: relative;
display: inline-block;
}
.line::before {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background: #000;
content: '';
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.