在 < input > 標籤裏面 比較常用的type屬性 以及用法

<input>標籤在HTML代碼裏面本身是空的，也就是說單獨調用<input>標籤是沒有任何作用的，而<input>標籤常用的屬性就是type，而type這個屬性也擁有着很多屬性，這篇文章主要是介紹一下type屬性常用的一些屬性 。

常用的type屬性

純文本內容 <input type="text" >
密碼純文本內容 <input type="password">
提交按鈕 <input type="submit">
單選框 <input type="radio">
多選框 <input type="checkbox">

比較常用的也就是上面這幾種type屬性。

text 和 password 的區別

  text 和 password  實際上是一模一樣的，他們全部是代表純文本內容屬性，text 屬性並不會對輸入框內的文本內容進行隱藏，而 password 屬性卻會對輸入框內的文本內容進行隱藏保護，password 屬性一般用於密碼輸入框。

    submit 屬性的作用

submit 屬性的作用就是把它所在的表單裏面的內容提交給服務器

在單個表單裏面正常情況下只會出現一次 submit屬性。

radio 屬性的介紹 以及代碼的寫法

 radio 屬性的介紹 

 radio 屬性代表的是單選框，我們在註冊賬號的時候，

 一般的話都有一個選擇性別的選項，而這個選項是單選的，

  這鐘選擇框就是單選框，也就是<input>標籤通過type調用 radio 屬性所達到的效果

  效果演示：

                   請選擇你的性別：
             男 女 保密

  代碼的寫法：

Markup
<form> 請選擇你的性別<br/>
<input type="radio" name="x"">男
<input type="radio" name="x" >女
<input type="radio" name="x">保密
</form>

checkbox 屬性的介紹 以及代碼的寫法

  checkbox 屬性的介紹：

  checkbox 屬性代表的是多選框，在很多網頁裏面也是可以看到的，例如選擇興趣愛好，很多人不止一種興趣愛好，而這個時候就會用到checkbox屬性來製作一個多選框，寫法和單選框radio屬性一樣的。

   演示效果 ：

        你有哪些興趣愛好？
        書法 籃球 足球

    代碼的寫法：

Markup
<form> 你有哪些興趣愛好？<br />
<input type="checkbox" name="x">書法
<input type="checkbox" name="x">籃球
<input type="checkbox" name="x">足球
</form>

後記

 單選框和多選框的前提是他們的選項是在同一個組，我們可以通過 name 屬性來設置一個組。

 我上面所說的屬性，全部是表單裏面<input>標籤所使用的 type屬性，並不代表在其他標籤裏面效果也一樣。

     https://www.cuteur.cn/post/513.html