软件测试 学习之路 html基础

一、标签有单标签、双标签
<标签名称></标签名称> >>>双标签 [在英文输入法下]
<标签名称 /> >>>单标签
二、html常见标签
标题标签：h1~h6 双标签
换行标签：p 双标签
换行标签： br 单标签
空格： &nbsp

注意：标签之间可以嵌套使用，但不能交叉嵌套；
错误写法：
·
正确写法：
图片标签 img 单标签
常见属性：src =“ 图片路径”
alt=" "图片无法显示时显示的内容
width=“ ”图片宽度
high=“ ”图片高度
注：src中的路径…/可表示返回当且文件夹的上级文件

链接标签:<a href="目标地址">内容</a>
例子：<a href="http://www.baidu.com">百度一下，你就知道</a>
效果：百度一下，你就知道
链接属性
新窗口跳转target="_blank"
例子：<a href="http://www.baidu.com"target="_blank">百度一下你就知道</a>
空链接：<a href="#">内容</a>

三、表单
用来填写资料提交后台
表单标签 双标签

表单结构 <form action="xxx" method="xxx"></form>
表单元素

1. 文本输入框： <input type="text" />
2. 密码输入框：<input type="password" />
3. 提交按钮：<input type="submit" />
4. 单选框：<input type="radio" />
5. 复选框：<input type="checkbox" />
6. 文本域：<textarea name="" rows="10" cols="50"></textarea> //ros为文本框行数 ，cols 为列数
7. 下拉框：

<select name="">
        			<option value="">选项一</option>
        			<option value="">选项二</option>
        			<option value="">选项...</option>
        		</select>

8. 重置按钮：<input type="reset" />
9. 普通按钮
   表单元素注意细节：
   1.name：主要是为了数据提交到后台时能够让后台区分存储；
   2.value：定义表单元素显示默认值（文本输入框、提交按钮、重置按钮、普通按钮）；
   3.checked：设置单选、复选框的默认选项，并且属性值等于属性名，其属性值可省略；
   4.selected：设置下拉菜单的默认选项；

简单的html邮箱注册页面骨架：`

	邮箱地址：<input type="text" name="" id="" placeholder="请输入邮箱地址"/>@ <select name="">
		<option value="1">163.com</option>
		<option value="2">162.com</option>
		<option value="3">qq.com</option>
	</select>
 	<br />
 	<br />
 	
	密码：<input type="password" />
	<br />
	
	<input type="radio" value="" />男
	<input type="radio" value="" />女
	<br /><br />
	验证码：<input type="text" name="" id="" height="80" />
	[外链图片转存失败(img-pPyVSe0p-1562214738505)(https://mp.youkuaiyun.com/mdeditor/img/1.jpg)]
	
	<br /><br />
	<input type="button" id="" value="免费获取验证码" />
	<br />
	<br />
	<br />
	备注：<br />
	<textarea name="" rows="5" cols="30">请输入信息</textarea>
	<br /><br />
	<input type="checkbox" name="" id="" value="" />同意
	
	<a href="#">服务条款</a>和"隐私权相关政策"
	<br /><br />
	<input type="submit" value="确认提交"/>
	<input type="reset" value="重置" />
	</form>
</body>

`