学UI自动化,前端的知识必不可少。学习的时候走马观花,今天真正写一个脚本的时候突然发现都不会定位了,果然需要多复习才是,
HTML超文本标记语言
1.全英文名称:HyperText Markup Language
2.结构:html语言由head 和body两部分组成,其中head部分中大部分是不可见的,但是有两个: title 和<link href="/static/image/title_icon.jpg" rel="shortcut icon">也就是如中圈主的两部分
3.html主要是讲标签,两部分中涉及到好多标签,首先就是<html></html>,一个html文件中只有一对html标签,当然如果页面中有嵌入其他页面,自然你会在源码中看到两对以上的<html>标签
标签也分为两种:自闭和标签主动闭合标签,顾名思义:
自闭和标签:既然是自,那肯定是自己一个人,而不是成双成对出现的,比如常见的<link href="/static/image/title_icon.jpg" rel="shortcut icon"> <img src="">
主动闭合标签:主动闭合,与自闭和标签相对,当然就是成对出现的标签了 <div></div> <span></span>等
扫描二维码关注公众号,回复:
2143269 查看本文章
4.主要标签讲解:
<!DOCTYPE html> <!--标准的html规则,类似于Python的解释器--> <html lang="en"> <!--html标签(只能一个),指定语言en--> <head> <!-- html head标签的开始 --> </head> <!-- html head标签的结束 --> <body> <!-- html body标签的开始 --> <a href="http://www.zhimashangfu.com">跳转芝麻商服</a> <!--类似有很多href这种的叫做标签内部属性--> </body> <!-- html body标签的结束 --> </html> 注释的写法 <!-- -->
<!-- 指定编码 --> <meta charset="UTF-8"> <!-- 每3秒中刷新一次 --> <meta http-equiv="refresh" content="1"> <!-- 3秒后跳转页面 --> <meta http-equiv="refresh" content="1;Url=http://www.zhimashangfu.com"> <!-- 关键字检索 --> <meta name="keywords" content="测试"> <!-- 网站描述--> <meta name="description" content="低调的测试工程师">
<body> <!--标题标签--> <!--<h1>标题标签</h1>--> <!--<h2>标题标签</h2>--> <!--<h3>标题标签</h3>--> <!--<h4>标题标签</h4>--> <!--<h5>标题标签</h5>--> <!--<h6>标题标签</h6>--> <!--段落标签--> <!--块级标签--> <!--<p>年轻,就是拿来折腾的。让自己具备独立生活的能力,具备一技之长的资本,<br>是需要无数个夜晚的静思,无数寂寞时光的堆积而成的。</p>--> <!--行内标签--> <!--白板标签--> <!--<span>年轻</span>--> <!--<!–伪白板标签–>--> <!--<div>年轻</div>--> <!--<span><p></p></span>--> <!--<span><p></p></span>--> <!--<input type="text" placeholder="请输入用户" name="useranme" value="admin">--> <!--<input placeholder="请输入密码" type="password" name="password">--> <!--<span>是否记住登录</span><input type="checkbox" name="xxx" checked="checked">--> <!--<div>性别</div>--> <!--<span>男</span><input type="radio" checked="checked" name="sex">--> <!--<span>女</span><input type="radio" name="sex">--> <!--<input type="file" name="file">--> <!--<!–button是需要和js连用 通过js进行提交操作–>--> <!--<input type="button" value="提交">--> <!--<form action="http://www.baidu.com" method="get">--> <!--<input type="text" value="admin" name="username">--> <!--<input type="reset">--> <!--<!–submit如果和form连用则 直接提交标单–>--> <!--<input type="submit" value="登录">--> <!--<input type="button" value="button登录">--> <!--</form>--> <!--扩展了input的可点击范围 --> <!--<label for="i1">用户名</label><input id="i1" type="text" value="admin">--> <!--<span>密码</span><input type="password">--> <!--多行文本--> <!--<textarea name="tex">sssss</textarea>--> <!--<select name="city" size="2" multiple="multiple">--> <!--<option value="1">北京</option>--> <!--<option value="2" selected="selected">河北</option>--> <!--<option value="3">黑龙江</option>--> <!--</select>--> <!--<select>--> <!--<optgroup label="黑龙江">--> <!--<option>牡丹江</option>--> <!--<option>哈尔滨</option>--> <!--</optgroup>--> <!--<optgroup label="河北">--> <!--<option>石家庄</option>--> <!--<option>唐山</option>--> <!--</optgroup>--> <!--</select>--> <!--超链接标签--> <!--<a href="http://www.baidu.com">百度</a>--> <!--<a href="#i1">跳转</a>--> <!--<div id="i1">ssssssssssssssssssssssssssss</div>--> <!--<ul>--> <!--<li>大连</li>--> <!--<li>秦皇岛</li>--> <!--</ul>--> <!--<ol>--> <!--<li>大连</li>--> <!--<li>秦皇岛</li>--> <!--</ol>--> <!--<dl>--> <!--<dt>黑龙江</dt>--> <!--<dd>牡丹江</dd>--> <!--<dd>哈尔滨</dd>--> <!--</dl>--> <!--<table border="1">--> <!--<thead>--> <!--<!–行–>--> <!--<tr>--> <!--<!–表头当中的列–>--> <!--<th>id</th>--> <!--<th>请求方式</th>--> <!--<th>参数</th>--> <!--<th>接口</th>--> <!--<th colspan="2">操作</th>--> <!--</tr>--> <!--</thead>--> <!--<tbody>--> <!--<!–行–>--> <!--<tr>--> <!--<!–表体中的列–>--> <!--<td>1</td>--> <!--<td>post</td>--> <!--<td>{'name':'dsx'}</td>--> <!--<td rowspan="3">/login</td>--> <!--<td>修改</td>--> <!--<td>删除</td>--> <!--</tr>--> <!--<tr>--> <!--<td>1</td>--> <!--<td>post</td>--> <!--<td>{'name':'dsx'}</td>--> <!--<td><a href="update.html">修改</a></td>--> <!--<td>删除</td>--> <!--</tr>--> <!--<tr>--> <!--<td>1</td>--> <!--<td>post</td>--> <!--<td>{'name':'dsx'}</td>--> <!--<td>修改</td>--> <!--<td>删除</td>--> <!--</tr>--> <!--</tbody>--> <!--</table>--> <!--<img src="http://ui.imdsx.cn/static/image/dsx1.jpg" alt="失败时展示的文字" title="鼠标悬浮时显示的文字">--> <div>1</div> <span>1</span> < > <input> <!--井号代指id--> <!--<a href="#i1"></a>--> <!--id 选择器--> <!--<div id="i1"></div>-->