亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

首頁課程HTML Fun ClassHTML5 form 1

HTML5 form 1

目錄列表

HTML5 表單

HTML5 為Web表單創(chuàng)建帶來了很多新特性,添加了多個(gè)新屬性和輸入類型,這些新特性提供了更好的輸入控制和驗(yàn)證。

HTML5 中的表單創(chuàng)建方式與 HTML 一樣:

<form>
   <input type="text" name="username" />
</form>


在空格處填寫正確的標(biāo)簽:

< > < type="text" name="username" /> </form>

HTML5 新屬性

placeholder 屬性

HTML5 添加了一個(gè)名為 placeholder 的新屬性。在 <input> 和 <textarea> 元素上,此屬性提供一種提示,描述輸入域所期待的值。

簡短的提示在用戶輸入值前會顯示在輸入域上。

實(shí)例

<form>
   <input type="text" name="fname" placeholder="First name" />
   <input type="text" name="lname" placeholder="Last name" />
   <input type="submit" value="提交" />
</form>


運(yùn)行顯示結(jié)果如下圖:


4.png

autofocus 屬性

當(dāng)表autofocus 屬性規(guī)定在頁面加載時(shí),域自動(dòng)地獲得焦點(diǎn)。

實(shí)例

讓 "First name" input 輸入域在頁面載入時(shí)自動(dòng)聚焦:

<form>
  First name: <input type="text" name="fname" autofocus><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit">
</form>


運(yùn)行顯示結(jié)果如下圖:


下載 (13).png

填寫空格讓輸入域在頁面載入時(shí)自動(dòng)聚焦,并創(chuàng)建一個(gè)提示:

<form> <input type="text" name="username" ="輸入你的用戶名" /> </form>

&amp;

帶必填字段的表單


required 屬性規(guī)定必須在提交之前填寫輸入域(不能為空)。

實(shí)例

不能為空的 input 字段:

<form autocomplete="off">
  Username: <input type="text" name="username" required />
  <input type="submit" />
</form>

運(yùn)行顯示結(jié)果如下圖:

下載 (14).png


autocomplete 屬性規(guī)定 form 或 input 域應(yīng)該擁有自動(dòng)完成功能。
當(dāng)用戶在自動(dòng)完成域中開始輸入時(shí),瀏覽器應(yīng)該在該域中顯示填寫的選項(xiàng)。


正確填寫以下空格創(chuàng)建不能為空的 input 字段:

<form> <input type="text" name="username" /> < type="text" name="name" required /> </form>