html5--3.16 button元素
生活随笔
收集整理的這篇文章主要介紹了
html5--3.16 button元素
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
html5--3.16 button元素
學習要點
- 掌握button元素的使用
button元素
- 用來建立一個按鈕從功能上來說，與input元素建立的按鈕相同
- button元素是雙標簽，其內部可以配置圖片與文字，進行更復雜的樣式設計
- 不僅可以在表單中使用，還可以在其他塊元素和內聯元素中使用
?
- button元素的屬性
- type屬性：可以設置三個值 submit/reset/button與input元素設置的按鈕含義相同
- name/vlue/disable屬性：與input的用法相同
- autofocus屬性：設置按鈕自動獲得焦點。
- form屬性：設定按鈕隸屬于哪一個或多個表單
- formmethod屬性：設定表單的提交方式，將覆蓋原本的提交方式
- formnovalidate屬性：設定表單將會覆蓋原本的novalidate屬性
- fomaction屬性：指定表單數據發送對象，將覆蓋原來的action屬性設定
- formenctype屬性;指定表單的數據發送類型，將覆蓋原本的enctype屬性設定
- formtarget屬性：將覆蓋原本的target屬性設定
重要事項：如果在表單中使用 button 元素，不同的瀏覽器會提交不同的值。Internet Explorer 將提交 button元素開始標簽與結束標簽之間的文本，而其他瀏覽器將提交 value 屬性的內容。最好就是在表單中使用 input 元素來創建按鈕。其他地方使用button創建按鈕
?
實例
?
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>無標題文檔</title> 6 </head> 7 <p style="color:#FF0000"> 8 </p> 9 <form action="L3_01.html" method="get" > 10 用戶名：<input type="text" name="name" size="30"><br><br> 11 意見：<textarea name="textarea" id="" cols="30" rows="5" placeholder="請輸入您的意見，謝謝！！" style="background: #F0FFFF"></textarea><br> 12 <!-- <br><input type="submit" value="確定"> <input type="reset"><br>--> 13 <br><button type="submit" style="background: #FFF0FF;border-radius: 10px;padding: 10px"><img src="pen.jpg" alt="" width="12px">提交</button> 14 <button type="reset" style="background: #FFFFF0;border-radius: 10px;padding: 10px">重置</button><br> 15 16 </form> 17 <body> 18 </body> 19 </html>
?
總結
以上是生活随笔為你收集整理的html5--3.16 button元素的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 女人梦到蜈蚣爬到身上会怎么样
- 下一篇： angular中的href=unsafe