ホームページ  >  記事  >  ウェブフロントエンド  >  CSS で下線入力を作成する box_html/css_WEB-ITnose

CSS で下線入力を作成する box_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:47:281621ブラウズ

これと同じ効果

<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;
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。