html超文本标记语言

学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>等

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>&ltp&gt&lt/p&gt</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>

    &lt &gt  
    <input>
    <!--井号代指id-->
    <!--<a href="#i1"></a>-->

    <!--id 选择器-->
    <!--<div id="i1"></div>-->

  

  

 

猜你喜欢

转载自www.cnblogs.com/bzdfxx/p/9301579.html