CSS例項橫線樣式的輸入框

在網上我們常常看見一些登錄檔單的輸入框部分並不是我們常見的矩形框，而是一條細線，很多朋友對此很感興趣。其實要實現這樣的效果並不困難，我們只要用一段簡短的css**控制好表單輸入框的樣式即可。

示例如下：

請輸入您的使用者名稱：

下面我們就來看看這段實現效果的css**。它主要運用了**邊框的樣式控制，將左、上、右邊框設定為none，只剩下下邊框即可。

樣式表中**解釋如下：

「border-left-style:none」：隱藏左邊框

「border-right-style: none」：隱藏右邊框

「border-top-style: none」：隱藏上邊框

「border-bottom-style: none」：隱藏下邊框。

下面讓我們一起來看乙個應用例項：　　　　　　橫線式輸入框　　

隱藏的邊框的輸入框：　　

使用者名稱：

實現效果簡潔清爽。

在網上我們常常看見一些登錄檔單的輸入框部分並不是我們常見的矩形框，而是一條細線，很多朋友對此很感興趣。其實要實現這樣的效果並不困難，我們只要用一段簡短的css 控制好表單輸入框的樣式即可。示例如下請輸入您的使用者名稱下面我們就來看看這段實現效果的css 它主要運用了邊框的樣式控制，將左上右...

輸入框允許使用者在 ui 中輸入文字。它們通常出現在表單和對話方塊中。輸入框元件設計應該為互動提供清晰的啟示，使輸入框在布局中易於發現高效地填充和可訪問。以下是輸入框的基本元素容器可互動輸入區輸入文字輸入文字字段標題告訴使用者這個輸入框該輸入什麼內容佔位符文字為使用者提供輸入文字前...

CSS例項 橫線樣式的輸入框