1. 程式人生 > >HTML5 第三章表單課後作業

HTML5 第三章表單課後作業

3,製作申請表單
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>申請表</title>
</head>
<body>
<h1>申請表</h1>
<form method="get" action="">
    <p>
        <label for="name">姓名:</label><input type="text" name="姓名" value="" id="name"></p>
    <p>教育程度:
         <input type="checkbox" name="ss" value="" id="master " checked><label for="master ">碩士</label>
        <input type="checkbox" name="bs" value="" id="doctor "> <label for="doctor ">博士</label></p>
    <p><label for="youxiang">常用郵箱:</label> <input type="email" name="郵箱" value="" id="youxiang"> </p>
    <p><input type="radio" name="2" value=""id="male"><label for="male">男</label>
        <input type="radio" name="2" value="" id="female "><label for="female ">女</label> </p>
    <p><label for="age">年齡:</label> <input type="text" value="" id="age"></p>
    <p><label for="money">月薪:</label> <input type="text" value="" id="money"></p>
    <p><label for="appended"> 附註:</label><textarea name="wenben" cols="30" rows="5" id="appended">請在這裡附註</textarea></p>
    <p>國籍<select name="guoji">
        <option value="">澳大利亞</option>
        <option value="1">美國</option>
        <option value="2">日本</option>
        <option value="3">新加坡</option>
    </select></p>
    <p><input type="submit" value="提交"><input type="reset" value="重置"></p>
</form>
</body>
</html>

4,製作電子產品調查表
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>電子產品調查問卷</title>
</head>
<body>
<h1>American Metric 電子產品調查問卷</h1>
<form method="get" action="">
    <p><label for="name">姓名:</label><input type="text" value="" id="name" placeholder="輸入必須是2-6位字元"></p>
    <p>購買日期:<select name="year">
    <option value="">2018</option>
    </select>
    <select name="month ">
        <option value="1">1月</option>
        <option value="2">2月</option>
        <option value="3">3月</option>
        <option value="4">4月</option>
        <option value="5">5月</option>
        <option value="6">6月</option>
        <option value="7">7月</option>
        <option value="8">8月</option>
        <option value="9">9月</option>
        <option value="10">10月</option>
        <option value="11">11月</option>
        <option value="12">12月</option>
    </select>
    <select name="day">
        <option value="1">1日 </option>
        <option value="2">2日</option>
        <option value="3">3日</option>
        <option value="4">4日</option>
        <option value="5">5日</option>
        <option value="6">6日</option>
        <option value="7">7日</option>
        <option value="8">8日</option>
        <option value="9">9日</option>
        <option value="10">10日</option>
        <option value="11">11日</option>
        <option value="12">12日</option>
        <option value="13">13日</option>
        <option value="14">14日</option>
        <option value="15">15日</option>
        <option value="16">16日</option>
        <option value="17">17日</option>
        <option value="18">18日</option>
        <option value="19">19日</option>
        <option value="20">20日</option>
        <option value="21">21日</option>
        <option value="22">22日</option>
        <option value="23">23日</option>
        <option value="24">24日</option>
        <option value="25">25日</option>
        <option value="26">26日</option>
        <option value="27">27日</option>
        <option value="28">28日</option>
        <option value="29">29日</option>
        <option value="30">30日</option>
    </select></p>
    <p><label for="yx">電子郵件地址:</label><input type="email" value="" id="yx" placeholder="
[email protected]
"></p> <p><label for="num">手機號碼:</label><input type="text" value="" id="num" placeholder="輸入必須是以13/15/18開頭的11位數"></p> <p>您是否檢視過我們的線上產品目錄?<input type="radio" name="xz" value="" checked >是 <input type="radio" name="xz" value="">否</p> <p>如果檢視過,您對那些產品有興趣購買?(選擇提供的產品)<br> <input type="checkbox" value="">大屏電視機<input type="checkbox" value="">音訊裝置<input type="checkbox" value="" >視訊裝置 <input type="checkbox" value="">相機</p> <p>在填寫訂單之前,您還有什麼問題,意見或建議?<br> <textarea name="" rows="2" cols="40" >您的輸入:</textarea></p> <p><input type="submit" value="提交"><input type="reset" value="重置" disabled></p> </form> </body> </html>


相關推薦

HTML5 課後作業

3,製作申請表單 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>申請表</title> <

2017年10月24日

selected button 單選框 選中 max eth 密碼框 網址 輸入文本 1.語法   <form method="get/post" action="數據向哪提交的地址"     //表單內容   </form> 2.input 標簽常用屬性

3-4 控制元件

1、輸入框inputbootstrap通過對input標籤的type屬性進行識別,得到相應的格式,所以input標籤一定要對type進行指定。另外,還需通過form-control對輸入框進行規範統一,此外,可以用placeholder對框內內容進行初始化。 <form role="form"&

3-1三大

基礎表單 水平表單 內聯表單 一、基礎表單類名“form-control”,實現一些設計上的定製效果。 1、寬度變成了100% 2、設定了一個淺灰色(#ccc)的邊框 3、具有4px的圓角 4、設定陰影效果,並且元素得到焦點之時,陰影和邊框效果會有所變化 5、設定了placeholder的顏色為#

HTML練習---基礎

<html> <head> <title>百度一下,你就知道</title> </head> <body> <form method="get" action="新建文字文件1.html">

HTML5課後作業

1.使用HTML5實現申請表表單<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>申請表</title&

我的啟蒙--HTML5 Canvas

上下文 javascrip blog 畫筆 str ava head tro top canvas     基本用法     要使用canvas元素,必須設置其width和height屬性!並且需要添加一些樣式才能在頁面上看見。    2d上下文:要在canvas上畫圖,需

10 元素[上]

聚焦 ova 提示 inpu Enctype 接收 如果 光標 文本框 第 10 章 表單元素[上] 學習要點: 1.表單元素解析 本章主要探討 HTML5 中表單元素,表單元素用於獲取用戶的輸入數據。 一.表單元素解析 1.<form>定義

10 元素[中]

datetime 布爾 method 長度 pattern value 文件上傳 不同 單元 第 10 章 表單元素[中] 學習要點: 1.type 屬性解析 本章主要探討 HTML5 中表單中 input 元素的 type 屬性,根據不同的值來顯示不同的輸

高程3總結#14指令碼

表單指令碼 表單的基礎知識 HTMLFormElement有自己獨特的屬性和方法 acceptCharset,伺服器能夠處理的字符集,等價於HTML中的accept-charset特性 action,接受請求的URL,等價於HTML中的action特性 elem

《資料結構與演算法分析-c語言描述》ADT程式碼補全

這本書講的很不錯(英文版)也讓我第一次懷疑了自己是否是中國人,翻譯啊真的有時候看不懂有時還要看英文版的才能看懂這個意思而且書上的程式碼給的不全故放部落格上給自己複習和造福大眾(???) #include<stdio.h> #include<stdlib.h

javafor迴圈課後作業

第一題:使用for迴圈結構實現:從鍵盤上接受從週一至週五每天的學習時間(以小時為單位),並計算每日平均學習時間。public static void test6() { /* * p136,第六章作業! * 從鍵盤上接受週一至週五每天的學習的時間(一小時為單位

認識django2.0讀書筆記(7)---

文件下載地址:Django_2.0_中文教程  http://download.csdn.net/detail/julius_lee/6620099 線上地址:http://djangobook.py3k.cn/2.0/ Django 2.0 Book 關鍵內容記錄,主要

5 和HTML輔助方法(HtmlHelper、輔助方法的使用、HTML輔助方法的工作原理、強型別輔助方法)

一、表單的使用1、表單<form action="http://www.bing.com/search" monthod="get"> <input name="q" type="text"/> <input type="submit" valu

資料結構與演算法分析—— 、棧和佇列1

3.1 抽象資料型別 抽象資料型別(ADT):一些操作的集合 理解:數學的抽象;模組化設計;沒有實際的資料,只是一種結構,一種對於資料儲存的思想。 3.2 表ADT 定義:空表、後繼、前驅 操作:PrintList、MakeEmpty、Find、Fin

初識jQuery課後作業

1.使用css()方法新增圖片邊框,單擊圖片顯示圖片bian邊框 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <titl

《資料結構與演算法分析》學習筆記--、棧和佇列

[toc] *** ## Fork me on Github 我自己實現了一個雙向迴圈連結串列,釋出在Github上。 叫**QuickList**,包含完整的連結串列模組原始碼和測試用例。==遵循GPL V2.0協議==。 大家可以去github上獲取,如果覺得好用請幫我點個star,謝謝啦嘿嘿~ [Qu

HTML5和CSS3開發課後作業

1,用HTML5實現申請表表單。<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>申請表</title&

HTML5 CSS3美化網頁課後作業

製作北大青鳥課程介紹頁面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>北大青鳥課程介紹</titl

Springboot之Thymeleaf 標籤(驗證)|-yellowcong

上一節剛剛講解了,如何通過Thymeleaf 來使用表單提交,現在我們這一節,講解如何使用表單驗證。Thymeleaf 表單驗證的步驟:1、新增hibernate-validator的依賴包。2、建立表單類,裡面添加註解說明欄位的資訊,3、建立介面控制器,