首页 > 代码库 > 学习HTML的第三次课
学习HTML的第三次课
浏览器的地址栏中有字数限制，大约为200个字符。
1.表单：<form action="" method=""></form>
属性： action=“” 提交路径 method="" 传输类型， 有get/post两种类型，即，以明文/密文的方式传输提交的数据
2.文本框：<input type="" name="" value="" id="">
属性：type="" 其中有很值分别代表不同的意义，常用的有，submit(提交)、password（密码）、reset（重置）、radio（单选）、checkbox（多选）、button（按钮）、text(普通文本框)
name="" 添加该属性，并指定值，才能收集用户的输入信息传入后台。
但对于不同的type属性也有不同的意义，当用于radio时，多个name一样，radio就有互斥性。
value=""用于不同的type类型，有不同的意义。如用于text和password中，即用收获取用户输入的具体数值。
id="" ID全局唯一，用于索引。其它用处不知道。
3.下拉列表：<select name="" id="">
<option value=http://www.mamicode.com/""></option>
</select>
属性：name="" 指定获取输入的名字。
value="" 不知道有什么用。但我知道它有用。
在option标签中默认选中属性为 selected
在input标签中默认选中属性为 checked
option[value=http://www.mamicode.com/$]{$}*6 == 6个<option value=""></option>
4.多行文本框：
<textarea name="" id="" cols="30" rows="10"></textarea>
属性： name 指定获取输入的值的名字。
cols 指定输入的最小的列数。
rows 指定输入的最小的行数。
5.<label for=""></label>
属性：for="" 其中的值与input id="" 中的值一致，可将label标签中的值与input相关连
例如： <input type="radio" id="radio"><label for="radio">radio</label>
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"/> 5 <meta name="keyword" content="关键字"/> 6 <meta name="discraption" content="描述"/> 7 <title>Sign in</title> 8 </head> 9 10 <body bgcolor="#fff8dc"> 11 <center> 12 <h1>登录</h1> 13 <form action="#" method="post"> 14 15 帐号：<input type="text" name="User" > <br/><br/> 16 17 密码：<input type="password" name="Pwd" > <br/><br/> 18 19 <a href="questionnaire.html" target="_blank"> 20 <input type="button" value="登录" width="50" height="10"> 21 </a> 22 23 <!--<br/> https://wj.qq.com/s/1333447/4afc/?pgv_ref=aio2015&ptlang=2052--> 24 </form> 25 </center> 26 27 </body> 28 </html>
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"/> 5 <meta name="keyword" content="关键字"/> 6 <meta name="discraption" content="描述"/> 7 <title>Registed</title> 8 </head> 9 10 <body bgcolor="#fff8dc"> 11 <marquee behavior="alternate" direction="right"> 12 <a href="Registed.html" target="_blank" style="float: right"> 注册</a> 13 <a href="Sign.html" target="_blank" style="float: right">登录</a> 14 </marquee> 15 16 <h1 align="center">注册</h1> 17 18 <center> 19 <form action="#" method="post"> 20 帐号：<input type="text" name="User"value="" > <br/><br/> 21 22 密码：<input type="password" name="Pwd" value=""> <br/><br/> 23 24 性别：<input type="radio" name="gender" value="male" id="male" checked> 25 <label for="male">男</label> 26 <input type="radio" name="gender" value="female" id="female"> 27 <label for="male">女</label> <br> 28 29 生日： 30 <select name="year" id=""> 31 <option value="1991" selected>1991</option> 32 <option value="1992">1992</option> 33 <option value="1993">1993</option> 34 <option value="1994">1994</option> 35 <option value="1995">1995</option> 36 <option value="1996">1996</option> 37 <option value="1997">1997</option> 38 <option value="1998">1998</option> 39 <option value="1999">1999</option> 40 </select>年 41 42 <select name="month" id=""> 43 <option value="01" selected>01</option> 44 <option value="02">02</option> 45 <option value="03">03</option> 46 <option value="04">04</option> 47 <option value="05">05</option> 48 <option value="06">06</option> 49 <option value="07">07</option> 50 <option value="08">08</option> 51 <option value="09">09</option> 52 <option value="10">10</option> 53 <option value="11">11</option> 54 <option value="12">12</option> 55 </select>月 56 57 <select name="day" id=""> 58 <option value="01" selected>01</option> 59 <option value="02">02</option> 60 <option value="03">03</option> 61 <option value="04">04</option> 62 <option value="05">05</option> 63 <option value="06">06</option> 64 <option value="07">07</option> 65 <option value="08">08</option> 66 <option value="09">09</option> 67 <option value="10">10</option> 68 <option value="11">11</option> 69 <option value="12">12</option> 70 <option value="13">13</option> 71 <option value="14">14</option> 72 <option value="15">15</option> 73 <option value="16">16</option> 74 <option value="17">17</option> 75 <option value="18">18</option> 76 <option value="19">19</option> 77 <option value="20">20</option> 78 <option value="21">21</option> 79 <option value="22">22</option> 80 <option value="23">23</option> 81 <option value="24">24</option> 82 <option value="25">25</option> 83 <option value="26">26</option> 84 <option value="27">27</option> 85 <option value="28">28</option> 86 <option value="29">29</option> 87 <option value="30">30</option> 88 <option value="31">31</option> 89 </select>日 <br> 90 91 邮箱：<input type="text" name="E-mail" > <br/><br/> 92 93 手机号：<input type="text" name="Number" > <br/><br/> 94 95 96 <a href="Sign.html" target="_blank"> 97 <input type="submit" value="提交"> 98 </a> 99 100 <input type="reset" value="重置"> 101 102 <!--<br/> https://wj.qq.com/s/1333447/4afc/?pgv_ref=aio2015&ptlang=2052--> 103 </form> 104 </center> 105 106 </body> 107 108 </html>
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>questionnaire</title> 6 <style> 7 8 div{margin-left:10%} 9 div{margin-right:10%} 10 </style> 11 </head> 12 13 <body bgcolor="#faebd7"> 14 15 <div align="center" > 16 <hr> 17 <h1 align="center">大学声调查 | 大学生实习兼职情况调查</h1> 18 <hr> 19 20 <p> 大学生在校期间，一般都会参与某些形式的兼职或者实习经历，但不同高校的学生能够得到的实习机会也颇有不同。<br> 21 22 大学声联合腾讯教育，进行了这次大学生实习情况调查，期待你的参与能发出大学生自己的声音。<br> 23 24 本调查共有21道选择题，花3-4分钟即可完成。<br> 25 26 （本调查问卷中提到的“实习”指大学生在校期间为提高就业竞争力，赚生活费，以及社会实践等目的进行的各类实习及兼职工作行为） 27 </p> 28 29 30 </div> <!--标题--> 31 32 33 <div align="center"> 34 <p> 35 1.你的性别是？<br> 36 <input type="radio" name="gender" id="male"> 37 <label for="male">男</label> 38 <input type="radio" name="gender" id="famale"> 39 <label for="famale">女</label> <br> 40 </p> <!--问题一：你的性别是？--> 41 42 <p> 43 2.你的本科入学时间是？<br> 44 <input type="radio" name="year" value="2011">2011年 <br> 45 <input type="radio" name="year" value="2012">2012年 <br> 46 <input type="radio" name="year" value="2013">2013年 <br> 47 <input type="radio" name="year" value="2014">2014年 <br> 48 <input type="radio" name="year" value="2015">2015年 <br> 49 <input type="radio" name="year" value="2016">2016年 <br> 50 </p> <!--问题二：入学年份--> 51 52 <p> 53 3.你所在的高校属于哪一类？<br> 54 <input name="SchoolType" type="radio" value="" id="">985工程院校 <br> 55 <input name="SchoolType" type="radio" value="" id="">211非985高校 <br> 56 <input name="SchoolType" type="radio" value="" id="">普通本科院校 <br> 57 <input name="SchoolType" type="radio" value="" id="">普通专科院校 <br> 58 <input name="SchoolType" type="radio" value="" id="">独立学院 <br> 59 <input name="SchoolType" type="radio" value="" id="">职业技校 <br> 60 <input name="SchoolType" type="radio" value="" id="">中外联合办学 <br> 61 <input name="SchoolType" type="radio" value="" id=<"">其他 <br> 62 </p> <!--问题三：学校类型--> 63 64 <p> 65 4.你所学的专业大概属于下列哪一类？ <br> 66 <input type="radio" name="project" value="" id="">理工 <br> 67 <input type="radio" name="project" value="" id="">经管 <br> 68 <input type="radio" name="project" value="" id="">艺术 <br> 69 <input type="radio" name="project" value="" id="">体育 <br> 70 <input type="radio" name="project" value="" id="">教育 <br> 71 <input type="radio" name="project" value="" id="">法律 <br> 72 <input type="radio" name="project" value="" id="">医学 <br> 73 <input type="radio" name="project" value="" id="">农学 <br> 74 <input type="radio" name="project" value="" id="">其它 <br> 75 76 </p> <!--问题四：专业类型--> 77 78 <p> 79 5.你在大学期间有过多少次实习经历？ <br> 80 <input type="radio" name="experience" value="" id="">5次以上<br> 81 <input type="radio" name="experience" value="" id="">3-4次<br> 82 <input type="radio" name="experience" value="" id="">1-2次<br> 83 <input type="radio" name="experience" value="" id="">一次都没有<br> 84 </p> 85 86 87 88 </div> <!--正文--> 89 90 <div align="center"> 91 <a href="#"> 92 <input type="submit" id="" value="提交"> 93 </a> 94 </div> <!--结尾--> 95 96 97 </body> 98 99 </html>
学习HTML的第三次课
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。