HTML5基礎加強css樣式篇(語義化表單)(五十六)
阿新 • • 發佈:2019-01-26
1.語義化表單
<!doctype html> <html> <head> <meta charset="UTF-8"/> </head> <body> <form action="" method="get"> <!--label 關聯標籤--> <input type="text" name="userNo" /> <label for="email"> 郵箱</label> <input type="email" name="email" id="email"/> <laber for="tel">電話</laber> <input type="tel" name="tel" id="tel"> <laber for="number">數字</laber> <!--注意 number的屬性, max,min ,step:每次加多少--> <input type="number" name="number" id="number"> <laber for="range">刻度條</laber> <!--注意 range, max,min ,step:每次加多少--> <input type="range" name="range" id="range"> <label for="color">顏色</label> <input type="color" name="color" id="color"/> <label for="datetime_local">日期+時間</label> <input type="datetime-local" name="datetime-local" id="datetime_local"> </form> </body> <script type="text/javascript"> var color=document.querySelector("#color"); color.onchange=function(){ //返回值是十六進位制 console.log(color.value); } </script> </html>
2.input日期外掛使用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"></script> </head> <body> <input class="Wdate" type="text" onClick="WdatePicker()"> <script type="text/javascript"> </script> </body> </html>