如何為數字輸入添加文字後綴以進行視覺區分？

將文字後綴附加到數字輸入

在典型場景中，數字輸入如<code class=" css>/* Prepare wrapper element */ div { display: inline-block; position: relative; } /* Position the unit to the right */ div::after { position: absolute; top: 2px; right: .5em; transition: all .05s ease-in-out; } /* Adjust unit position on hover and focus */ div:hover::after, div:focus-within::after { right: 1.5em; } /* Override for Firefox (arrows always shown) */ @supports (-moz-appearance:none) { div::after { right: 1.5em; } } /* Specify abbreviation for each unit class */ .ms::after { content: 'ms'; } .db::after { content: 'db'; } .percent::after { content: '%'; }</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><code class="html"><div class="ms"> <input type="number" id="milliseconds"> </div> <hr> <div class="db"> <input type="number" id="decibel"> </div> <hr> <div class="percent"> <input type="number" id="percentages"> </div></code>

登入後複製

以上是如何為數字輸入添加文字後綴以進行視覺區分？的詳細內容。更多資訊請關注PHP中文網其他相關文章！