HTML相关学习
HTML
<!-- -->:注释；
<!DOCTYPE html>：告诉浏览器，使用html的规范；
<html>
<head>：代表网页的头部；
<meta charset="UTF-8">：meta标签，描述性标签，一般用来seo；
<title>我的第一个网页</title>：代表网页的标题；
</head>
<body>：代表网页的主体；
我的第一个网页
</body>
</html>
第二讲：标签
<body>
<h1>1级标签</h1>
<h2>2级标签</h2>
<h3>3级标签</h3>
<h4>4级标签</h4>
<h5>5级标签</h5>
<h6>6级标签</h6>
<p>第一行</p>
<p>第二行</p>
第三行换行符<br/>
第四行换行符<br/>
<hr/>横线
<br>
<strong>粗体标签</strong>
<br>
<em>斜体标签</em>
<!--注释符号 -->
<br>
特殊符号可以去百度查询！
<br>
空       格符号
<br>
>大于号
<br>
<小于号
<br>
©版权符号
</body>
第三讲：图片标签
<img src="../resource/image/12.png" alt="空白图像" title="悬停文字"width="1600"height="900">
1、src--》图片的地址；
2、alt--》图片加载失败时提示的文字名字；
3、title--》图片上鼠标悬停时显示的文字；
4、width--》宽度；
5、height--》高度；
第四讲：超链接标签
<a name="top">顶部</a>：作为标记；
<a href="https:www.baidu.com" target="_blank">跳转到百度
<img src="../resource/image/12.png" alt="空白图像" title="悬停文字"width="1600"height="900">
</body>
</a>
以上body内容，点击文字和图片都能够跳转到百度；
<a href="#top">回到顶端</a>：通过标记回到页面的顶部；（这个功能也可以从别的页面跳转过来）
<a href="mailto:邮箱名字">联系我</a>：可以通过这个标签调用电脑邮件软件；
1、href--》表示要跳转到哪个标签；
2、target--》表示窗口在哪里打开；（_blank:新窗口打开;_self:在自己页面打开；）
第五讲：块元素和行内元素
快元素是指标签内的内容占一行
行内元素是指几个标签内的内容都在一行
第六讲：列表标签
有序列表
<ol>
<li>java</li>
<li>java1</li>
<li>java2</li>
<li>java3</li>
<li>java4</li>
</ol>
无序列表
<ul>
<li>java</li>
<li>java1</li>
<li>java2</li>
<li>java3</li>
<li>java4</li>
</ul>
自定义列表
<dl>
<dt>学科</dt>
<dd>java</dd>
<dd>linux</dd>
</dl>
第七讲：表格
<table border="1px">：表格的格式；
<tr>：行;
<td colspan="4">1-1</td>列；colspan是单元格指合并4列；
<td>1-2</td>
<td>1-3</td>
</tr>
<tr>
<td rowspan="2">2-1</td>：rowspan是指单元格合并2行；
<td>2-2</td>
<td>2-3</td>
</tr>
<tr>
<td>3-1</td>
<td>3-2</td>
<td>3-3</td>
</tr>
</table>
第八讲：媒体元素
<video src="../resource/video/as.mp4" controls >111</video>：视频标签；
<audio src="../resource/video/as.mp4" controls "></audio>：音频标签；
第九讲：网页结构分析
<header> <h2>网页头部</h2></header>：标记头部区域的内容；
<footer> <h2>网页底部</h2></footer>：标记脚部区域的内容；
<section> <h2>快</h2></section>：web页面中的一块独立区域；
article：独立的文章内容；
aside：相关内容或应用（常用于侧边栏）；
nav：导航类辅助内容；
第十讲：iframe内联框架
<iframe src="https://www.baidu.com" name="hello" frameborder="0"width="1000" height="700"> </iframe>
<a href="http://kewang.work" target="hello">点此跳转</a>
可以通过a标签来条状连接仍然放到内联框架内
第十一讲：表单
<h1>注册</h1>
<form method="get" action="我的第一个网页.html">：表单标签，get方法提交时url内显示输入信息，post方法的话不会在url内显示输入信息；
<p>名字：<input type="text" name="username" id=""></p>：设置了一个输入框输入名字；
<p>密码：<input type="password" name="pwd" id=""></p>：设置了一个输入框输入密码；
<p><input type="submit">：设置了一个提交按钮；
<input type="reset"></p>：设置了一个重置按钮；
</form>
第十二讲：文本框和单选框
type：指定元素的类型，text、password、checkbox、radio、submit、reset、file、hidden、image、button、默认为text；
name：指定表单元素的名称；
value：元素的初始值，type为radio时必须指定一个值；
size：指定表单元素的初始宽度。当type为text或password时，表单元素的大小以字符为单位。对于其他类型，宽度以像素为单位；
maxlength：type为text或password时，输入的最大字符数；
checked：type为radio或checkbox时，指定按钮是否是被选中；
<p>xingbie: --》这是个单选框，使用相同name后就只能选择一个了；
<input type="radio" value="boy" name="sex" checked>男：后面的男是页面显示，内部识别是选择了boy的值；加checked会默认选中；
<input type="radio" value="gril" name="sex">女：选择后，后端会提示sex=gril；
</p>
第十三讲：多选框和按钮；
<p>aihao: --》多选框选型，checkbox；name需要一致，value值为后端显示的值；
<input type="checkbox" value="sleep" name="happy">shuijiao
<input type="checkbox" value="code" name="happy">xiedaima
<input type="checkbox" value="chat" name="happy">liaotian
<input type="checkbox" value="game" name="happy">youxi
</p>
<input type="button" name="btn1" value="点击变长">：按钮，名字是点击变长；
第十四讲：下拉框
<select name="列表名称" >
<option value="china">中国</option>
<option value="usa">美国</option>
<option value="ruishi" selected>瑞士</option>：加入selected会默认选中；
<option value="eluosi">俄罗斯</option>
</select>
第十五讲：文本域和文件域
<textarea name="textarea" cols="30" rows="10">文本内容</textarea>：cols是列数，rows是行数；
<input type="file" name="files">：文件域标签，可以选择文件，后端显示files=选择的文件；
第十六讲：搜索框滑块和简单验证
<p>商品数量：
<input type="number" name="num" max="100" min="0" step="1" >
</p>
<p>音量：滑块；
<input type="range" name="voice" min="0" max="100" step="2" >
</p>
<p>搜索：
<input type="search" name="search">
</p>
第十七讲：表单的应用
在标签内加相应控制符
readonly：只读
disable：禁用
hidden：隐藏
<p>搜索：
<label for="mark">点我试试</label>：可以支持点击文字就跳转到id=mark的文本输入框中
<input type="search" name="search" id="mark">
</p>
第十八讲：表单初级验证
placeholder="请输入用户名"：可以提示用户输入信息；
required=""：表示此字段不能为空；
pattern：正则表达式；
