ホームページ > 記事 > ウェブフロントエンド > CSS で下線入力を作成する box_html/css_WEB-ITnose
これと同じ効果
<input type="text" class="input" />
シンプルバージョン
border: 0; outline: 0; background: transparent; border-bottom: 2px solid black; width: 20px;
もう少し複雑で美しい
background-color: transparent; border: none; border-bottom: 2px solid #fff; outline: none; padding-bottom: 10px; text-align: center; width: 400px; font-size: 300%; color: #fff; font-weight: 100;