学习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=""></option>
</select>
属性:name="" 指定获取输入的名字。
value="" 不知道有什么用。但我知道它有用。
在option标签中默认选中属性为 selected
在input标签中默认选中属性为 checked
option[value=$]{$}*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>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="keyword" content="关键字"/>
<meta name="discraption" content="描述"/>
<title>Sign in</title>
</head> <body bgcolor="#fff8dc">
<center>
<h1>登录</h1>
<form action="#" method="post"> 帐号:<input type="text" name="User" > <br/><br/> 密码:<input type="password" name="Pwd" > <br/><br/> <a href="questionnaire.html" target="_blank">
<input type="button" value="登录" width="50" height="10">
</a> <!--<br/> https://wj.qq.com/s/1333447/4afc/?pgv_ref=aio2015&ptlang=2052-->
</form>
</center> </body>
</html>
登录
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="keyword" content="关键字"/>
<meta name="discraption" content="描述"/>
<title>Registed</title>
</head> <body bgcolor="#fff8dc">
<marquee behavior="alternate" direction="right">
<a href="Registed.html" target="_blank" style="float: right"> 注册</a>
<a href="Sign.html" target="_blank" style="float: right">登录</a>
</marquee> <h1 align="center">注册</h1> <center>
<form action="#" method="post">
帐号:<input type="text" name="User"value="" > <br/><br/> 密码:<input type="password" name="Pwd" value=""> <br/><br/> 性别:<input type="radio" name="gender" value="male" id="male" checked>
<label for="male">男</label>
<input type="radio" name="gender" value="female" id="female">
<label for="male">女</label> <br> 生日:
<select name="year" id="">
<option value="1991" selected>1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
</select>年 <select name="month" id="">
<option value="01" selected>01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>月 <select name="day" id="">
<option value="01" selected>01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</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>
<option value="31">31</option>
</select>日 <br> 邮箱:<input type="text" name="E-mail" > <br/><br/> 手机号:<input type="text" name="Number" > <br/><br/> <a href="Sign.html" target="_blank">
<input type="submit" value="提交">
</a> <input type="reset" value="重置"> <!--<br/> https://wj.qq.com/s/1333447/4afc/?pgv_ref=aio2015&ptlang=2052-->
</form>
</center> </body> </html>
注册
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>questionnaire</title>
<style> div{margin-left:10%}
div{margin-right:10%}
</style>
</head> <body bgcolor="#faebd7"> <div align="center" >
<hr>
<h1 align="center">大学声调查 | 大学生实习兼职情况调查</h1>
<hr> <p> 大学生在校期间,一般都会参与某些形式的兼职或者实习经历,但不同高校的学生能够得到的实习机会也颇有不同。<br> 大学声联合腾讯教育,进行了这次大学生实习情况调查,期待你的参与能发出大学生自己的声音。<br> 本调查共有21道选择题,花3-4分钟即可完成。<br> (本调查问卷中提到的“实习”指大学生在校期间为提高就业竞争力,赚生活费,以及社会实践等目的进行的各类实习及兼职工作行为)
</p> </div> <!--标题--> <div align="center">
<p>
1.你的性别是?<br>
<input type="radio" name="gender" id="male">
<label for="male">男</label>
<input type="radio" name="gender" id="famale">
<label for="famale">女</label> <br>
</p> <!--问题一:你的性别是?--> <p>
2.你的本科入学时间是?<br>
<input type="radio" name="year" value="2011">2011年 <br>
<input type="radio" name="year" value="2012">2012年 <br>
<input type="radio" name="year" value="2013">2013年 <br>
<input type="radio" name="year" value="2014">2014年 <br>
<input type="radio" name="year" value="2015">2015年 <br>
<input type="radio" name="year" value="2016">2016年 <br>
</p> <!--问题二:入学年份--> <p>
3.你所在的高校属于哪一类?<br>
<input name="SchoolType" type="radio" value="" id="">985工程院校 <br>
<input name="SchoolType" type="radio" value="" id="">211非985高校 <br>
<input name="SchoolType" type="radio" value="" id="">普通本科院校 <br>
<input name="SchoolType" type="radio" value="" id="">普通专科院校 <br>
<input name="SchoolType" type="radio" value="" id="">独立学院 <br>
<input name="SchoolType" type="radio" value="" id="">职业技校 <br>
<input name="SchoolType" type="radio" value="" id="">中外联合办学 <br>
<input name="SchoolType" type="radio" value="" id=<"">其他 <br>
</p> <!--问题三:学校类型--> <p>
4.你所学的专业大概属于下列哪一类? <br>
<input type="radio" name="project" value="" id="">理工 <br>
<input type="radio" name="project" value="" id="">经管 <br>
<input type="radio" name="project" value="" id="">艺术 <br>
<input type="radio" name="project" value="" id="">体育 <br>
<input type="radio" name="project" value="" id="">教育 <br>
<input type="radio" name="project" value="" id="">法律 <br>
<input type="radio" name="project" value="" id="">医学 <br>
<input type="radio" name="project" value="" id="">农学 <br>
<input type="radio" name="project" value="" id="">其它 <br> </p> <!--问题四:专业类型--> <p>
5.你在大学期间有过多少次实习经历? <br>
<input type="radio" name="experience" value="" id="">5次以上<br>
<input type="radio" name="experience" value="" id="">3-4次<br>
<input type="radio" name="experience" value="" id="">1-2次<br>
<input type="radio" name="experience" value="" id="">一次都没有<br>
</p> </div> <!--正文--> <div align="center">
<a href="#">
<input type="submit" id="" value="提交">
</a>
</div> <!--结尾--> </body> </html>
问卷调查
学习HTML的第三次课的更多相关文章
- 风炫安全web安全学习第三十二节课 Python代码执行以及代码防御措施
风炫安全web安全学习第三十二节课 Python代码执行以及代码防御措施 Python 语言可能发生的命令执行漏洞 内置危险函数 eval和exec函数 eval eval是一个python内置函数, ...
- [转]Spark学习之路 (三)Spark之RDD
Spark学习之路 (三)Spark之RDD https://www.cnblogs.com/qingyunzong/p/8899715.html 目录 一.RDD的概述 1.1 什么是RDD? ...
- centos HA高可用集群 heartbeat搭建 heartbeat测试 主上停止heartbeat服务 测试脑裂 两边都禁用ping仲裁 第三十二节课
centos HA高可用集群 heartbeat搭建 heartbeat测试 主上停止heartbeat服务 测试脑裂 两边都禁用ping仲裁 第三十二节课 heartbeat是Linu ...
- WCF学习之旅—第三个示例之四(三十)
上接WCF学习之旅—第三个示例之一(二十七) WCF学习之旅—第三个示例之二(二十八) WCF学习之旅—第三个示例之三(二十九) ...
- WCF学习之旅—第三个示例之二(二十八)
上接WCF学习之旅—第三个示例之一(二十七) 五.在项目BookMgr.Model创建实体类数据 第一步,安装Entity Framework 1) 使用NuGet下载最新版的Entity Fram ...
- WCF学习之旅—第三个示例之三(二十九)
上接WCF学习之旅—第三个示例之一(二十七) WCF学习之旅—第三个示例之二(二十八) 在上一篇文章中我们创建了实体对象与接口协定,在这一篇文章中我们来学习如何创建WCF的服务端代码.具体步骤见下面. ...
- WCF学习之旅—第三个示例之五(三十一)
上接WCF学习之旅—第三个示例之一(二十七) WCF学习之旅—第三个示例之二(二十八) WCF学习之旅—第三个示例之三(二十九) WCF学习 ...
- css学习归纳总结(三) 转
原文地址:css学习归纳总结(三) 为文档添加样式的三种方法 行内样式 行内样式是写在HTML标签的style属性里的,比如: <p style="font-size: 12px;fo ...
- NeHe OpenGL教程 第三十七课:卡通映射
转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...
随机推荐
- python提示import XX 不存在,如何排查错误
1.如何确定文件夹是一个包, 检查包中是否有__init__.py 文件, 在python模块的每一个包中,都有一个__init__.py文件(这个文件定义了包的属性和方法)然后是一些模块文件和子目录 ...
- 关于Linux中文件,链接的一些思考
在Unix系统中,操作系统为磁盘上的文本与图像,鼠标键盘操作,网络交互等IO操作设计了一组通用API. 使他们被处理的时候可统一用字节流的方式.所以说,除了进程之外,其他的一切均可看做文件. Linu ...
- 工作流Activiti5.13学习笔记(一)
了解工作流 1.工作流(Workflow),就是“业务过程的部分或整体在计算机应用环境下的自动化”,它主要解决的是“使在多个参与者之间按照某种预定义的规则传递文档.信息或任务的过程自动进行,从而实现某 ...
- vue计算属性详解——小白速会
一.什么是计算属性 模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id="example"> ...
- Windows下Apache的下载安装启动停止
一:下载 打开任意浏览器,输入网址:http://httpd.apache.org/ 进入如下界面: 我们选择最新版Apache httpd 2.4.12Released,点击Download,进入如 ...
- 201621123050 《Java程序设计》第11周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多线程相关内容. 2. 书面作业 本次PTA作业题集多线程 1. 源代码阅读:多线程程序BounceThread 1.1 BallR ...
- 201621123050 《Java程序设计》第2周学习总结
1.本周学习总结 java的数据类型 基本数据类型:介绍了java特有的boolean 引用数据类型 String:不变性:需要频繁修改时使用StringBuilder 包装类:自动拆.装箱 数组 一 ...
- 浅谈CPU三级缓存和缓存命中率
CPU: CPU缓存(Cache Memory)是位于CPU与内存之间的临时存储器,它的容量比内存小的多但是交换速度却比内存要快得多.缓存的出现主要是 为了解决CPU运算速度与内存读写速度不匹配的矛盾 ...
- Python format 格式化函数
str.format() 格式化字符串的函数 str.format(),它增强了字符串格式化的功能. 基本语法是通过 {} 和 : 来代替以前的 % format 函数可以接受不限个参数,位置可以不按 ...
- Linux "零拷贝" sendfile函数中文说明及实际操作
Sendfile函数说明 #include ssize_t sendfile(int out_fd, int in_fd, off_t *offset, size_t count); sendfile ...