以前上学学过这门课程，但作为测试的我，工作中使用得甚少。因最近需要做自动化测试，则再次复习一下html的内容，为以后做测试工作理解程序更清晰，将复习内容记录下来，方便以后查看。
html：超文本标记语言，由标签组成，不区分大小写。
一、网页=html+css+javascript
1、html：封装网页上的数据，给页面提供格式，不是编程语言。
2、css：美化和修饰页面。
3、javascript：操作页面。
二、html的使用
1、标记HTML语言的范围：
<span style="font-family:Microsoft YaHei;"><html>
<head>代码的头部分（辅助信息）
<title>这时我的第一个网页</title>
</head>
<body>体部分，包含网页的实际包含数据</body>
</html></span>3、字体的标签font：改变字体的大小和颜色。
<font size=“5” color=“red”>字体标签示例</font>5、转义字符，所有的转义字符都是以&关键字开头，如：
1）< 代表：<
3）& 代表：&
4）" 代表："
5） 代表：空格
6）  代表：Tab
6、图像标签
<span style="font-family:Microsoft YaHei;"><img alt=“<span style="color:#000000;">图片辅助说明</span>” src=“a.jpg”/></span>路径分为：
绝对路径：就是文件的计算机路径，兼容性差；
相对路径：同一目录下，直接写文件的名称 Koala.jpg
同一目录下的目录下边的文件，images/Koala.jpg
与上层目录相同目录的目录下， ../images/Koala.jpg
7、表格标记
1）表格标记（<table></table>）由行和列组成
2）标题标签：<caption> </caption> 居中显示
3）表头标签：<th></th>
4）行标签：<tr></tr>
5）列标签：<td></td>
6）<tbody></tbody>分模块的显示，在网页中可以分块显示，存在的目的：加快页面上数据的显示速度。
参数：
border :设置表格的边框。
bordercolor:设置表格边框的颜色。
cellpadding:文本与边框的距离。
cellspacing:td与td之间的距离。
跨行合并单元格： rowspan="2"
跨列合并单元格： colspan="2"，注意，被合并的行或列就不需要写出来了。
8、超链接：
<a href="URL" target=”target”>链接的名称</a>1）href属性的值要明确指定协议,如果没有明确指定,默认是file(文件)协议。它会到磁盘中去查找相关的内容。
2）一个网址必须书写完整，如http://www.baidu.com
3）a标签中包含着的连接地址中有这么几个协议系统识别 http/ftp/file
4）对于其他的协议：thunder、e2k/mailto等自定义协议会在本地资源内调用。
注意点：
下划线的表示：<a href="javascript:void(0)">下划线</a>
超链接的另外一种用法：定位标识（锚点）
<span style="font-family:Microsoft YaHei;"><a name=“first”>标题一</a>
<a href=“#first”>跳到标题一</a></span>9、框架标签
框架标签<frameset>不可以放在<body>标签内,一般放在<head>标签和<body>标签之间
1）框架的主要作用：用来拆分窗口的。
2）需要同时切割行列的时候，需要注意cols rows 。
3）进行切割，大小可以通过px直接控制，也可以用百分比来划分。
4）name属性是用来指定的地址位置的。
5）noresize 固定死框架结构，禁止用户重新更改窗口的尺寸。
6）切割的大小是用数值，*来确定的，target="name" 指定到该name属性的框架中。
7）画中画标签iframe
frameset 与 iframe 区别：前者是固定死的，后者是不固定的小窗口
<span style="font-family:Microsoft YaHei;"><iframe src=“1.html“ name=“right”>很遗憾您的浏览器不支持iframe</iframe></span>10、表单标签：from
<span style="font-family:Microsoft YaHei;"><form action=”指定的文件” method=”get/post”></form></span>2）get方式提交：提交过去的数据是存储请求行当中，通过浏览器地址可以看见提交的内容，不适合提交敏感信息的数据。
3）post方式提交：提交过去的数据是存储在请求体当中，通过浏览器地址看不见，这样子的好处是安全性高，不会暴露自己的信息。
<1>文本框
<span style="font-family:Microsoft YaHei;"><input type="text" name="user"> </span><2>密码框
<span style="font-family:Microsoft YaHei;"><input type="password" name="paw">
<input type="password" name="repaw"></span><3>单选框
<span style="font-family:Microsoft YaHei;"><input type="radio" name="sex">男
<input type="radio" name="sex">女</span>name相同的才能在其中选其一
<4>多选框
<span style="font-family:Microsoft YaHei;"><input type="checkbox" name="hobbies">游泳
<input type="checkbox" name="hobbies">看书
<input type="checkbox" name="hobbies">音乐
<input type="checkbox" name="hobbies">瑜伽</span><5>选择框
<span style="font-family:Microsoft YaHei;"><select>
<option>请选择省份</option>
<option>北京</option>
<option>上海</option>
<option>广州</option>
</select></span><6>上传照片
<span style="font-family:Microsoft YaHei;"><input type="file" /></span><7>多行文本框
<span style="font-family:Microsoft YaHei;"><textarea rows="5" cols="30" ></textarea></span>没有进行封装数据
<8>隐藏框
<span style="font-family:Microsoft YaHei;"><input type="hidden" /></span><9>提交按钮
<input type="submit" value="提交" /><10>重置按钮
<input type="reset" value="重置" />注意：重置不是删除信息，只是把所有值都恢复到默认值
<11>Value值的使用
<span style="font-family:Microsoft YaHei;"><input type=“text” name=“” /> <!--文本框-->
<input type=“password” name=“” /> <!--密码框-->
<input type=“radio” name=“” value=“” /> <!--单选框-->
</span><pre name="code" class="html"><pre name="code" class="html"><span style="font-family:Microsoft YaHei;"><input type=“checkbox” name=“” value=“”/> <!--复选框-->
<input type=“hidden” name=“” value=“”/> <!--隐藏框：页面不显示,但是数据需要提交-->
<input type=“submit” /> <!--提交按钮：单击后提交表单内容-->
<input type=“reset” /> <!--重置按钮：将表单元素中输入的内容设置为初始值-->
<input type=“button” value=“按钮” /> <!--按钮：自定义事件,value为按钮显示文本-->
<input type=“file”> <!--文件上传-->
<input type=“image” /> <!--图像：可以取代提交按钮,可以设置按钮图片背景--></span><span style="font-family:Microsoft YaHei;"><select> <!--<span style="color:#000000;">下拉列表（可多选）</span>-->
<option>--请选择国家--</option> <!--中国默认情况下被选中-->
<option value=“中国” selected=“selected”>中国</option>
<option value=“美国”>美国</option>
</select></span>11、Name 与Value的区别：
Name: 当把表单数据传递给服务端的时候，name属性作为参数的名称而存在。
Value: 把表单数据传递给服务端的时候，value属性作为参数的值而存在。其中，作为按钮而言，value是按钮中显示的文本。作为可输入的文本框及密码框而言，value就是用户输入的内容。
扫一扫
2819
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
