HTML( hyper text markup language)超文本标记语言，俗称网页。
组成：html网页首先用<html></html>包起来，里面的内容就是网页，<html>开始，</html>结束。html网页包含两个部分，头head和身体body，头从<head>开始,到</head>结束，中间是子标签。身体从<body>开始，到</body>结束，中间是子标签。
<html> <head> 子标签 </head> <body> 子标签 </body> </html>
head子标签
头标签里面一般有四个子标签，<meta>,<title></title>,<link>,<script></script>
（1）<meta charset="字符编码"> 用来指定网页的字符编码。
注意：填写的字符编码要与自己编译网页的时编译器的字符编码一致，不是charset等于什么就是什么。
（2）<title>网页标题</title> 中间填写的内容网页的标题。
<html> <head> <meta charset="UTF-8"> <title>我的第一个网页</title> </head> <body> </body> </html>
(3)<script><script>用来包含外部格式样式，用js控制网页的样式。
(4)<link>用来包含外部格式样式，用js统一控制网页的样式。
body子标签
身体标签中一般有：标题标签,正文标签,超链接标签,列表标签,表格标签,表单标签,iframe......
1标题标签：一共有六个
<h1> <h2> ... <h6>数字越大字越小
html> <head> <meta charset="UTF-8"> <title>我的第一个网页</title> </head> <body> <h1>1</h1> <h3>3</h3> <h5>5</h5> <h6>6</h6> </body> </html>
2 正文标签:
（1）<p>正文</p>中间写网页的段落，会换行。在写网页段落正文时，比如/，&等都是关键字，要写这些特殊字符时 要转义显示。比如：<用<表示 >用>表示 ©用©表示 空格用&nbsq表示...
（2）<br>换行标签，用来换行。
（3）<hr>分割线。
<html> <head> <meta charset="UTF-8"> <title>我的第一个网页</title> </head> <body> <p>©第一个 段落</p> <hr> <br> <hr> <p><第二个段落></p> </body> </html>
（3）超链接标签：
页面间的连接：<a href="链接地址">链接文字</a> 就是网页之间跳转的桥梁。连接地址填的是网页的路径。
两个网页在同一个文件夹下就直接写网页存放地址。没在一个文件夹下要从两个网页存放地址不同时写起
第一个网页代码 <html> <head> <meta charset="UTF-8"> <title>我的第一个网页</title> </head> <body> <a href="Test2.html">跳到第二个网页</a> </body> </html> 第二个网页代码 <html> <head> <meta charset="UTF-8"> <title>我的第二个网页</title> </head> <body> <a href="Text1.html">跳到第一个网页</a> </body> </html>
页面内连接：首先在目的地标签添加 id="唯一编号", 然后在超链接的 href="#唯一编号"，俗称锚。
用在网页正文多，要查看网页前面比较重要的内容时添加一个页内连接，点击后就从当前位置跳到id标记的段落处。
<html> <head> <meta charset="UTF-8"> <title>我的第二个网页</title> </head> <body> <p id="c1">第一段</p> <p>第二段</p> <p>第三段<a href="#c1">跳到第一段</a></p> </body> </html>
图片标签：<img src="图片地址" > 里面还可以用width="宽度" height="高度"控制图片的大小。
<html> <head> <meta charset="UTF-8"> <title>我的第二个网页</title> </head> <body> <img src="1.png" width="100px" height="100px"> </body> </html>
连接和图片标签可以结合起来： 此时点击图片就会跳转到第一个网页。
<html> <head> <meta charset="UTF-8"> <title>我的第二个网页</title> </head> <body> <a href="Text1.html"><img src="1.png" width="100px" height="100px"></a> </body> </html>（4）列表标签：分为有序和无序。ul标签是无序的，ol标签是有序的。
<html> <head> <meta charset="UTF-8"> <title>我的第二个网页</title> </head> <body> <ul> <li>语文</li> <li>英语</li> <li>数学</li> </ul> <ol> <li>唱歌</li> <li>跳舞</li> <li>小品</li> </ol> </body> </html>
（5）表格标签
格式：<table>表格</table> 里面有三部分 <thead>表头</thead>，<tbody>身体</tbody>， <tfoot>表尾</tfoot>。表头是对表格内容的标注，里面<tr>行，<th>列。身体中方表格正文，里面<tr>行，<td>列。有表尾一般是标注。
加border就会出现边框，用 colspan（合并列）rowspan（合并行）
<html> <head> <meta charset="UTF-8"> <title>我的第二个网页</title> </head> <body> <table border> <thead> <tr> <th>姓名</th> <th>语文</th> <th>数学</th></tr> </thead> <tbody> <tr> <td>张三</td> <td>88</td> <td>95</td> </tr> <tr> <td>王五</td> <td>88</td> <td>95</td> </tr> <tr> <td>李四</td> <td>88</td> <td>95</td> </tr> </tbody> <tfoot>成绩表</tfoot> </table> </body> </html>
（6）表单标签：
表单标签用<form>表单</form> 用来接收用的输入。写上<form action=“URL”>，点击提交按钮后把有name属性的标签上传到指定地方。
密码框和文本框表面一样，但密码框填写内容时，不会会显示内容。
文本框 <input type="text" name="username">
密码框 <input type="password" name="password">
按钮 <input type="button" value="点我">
提交<input type="submit" value="提交">
重置<input type="reset" vlaue="重置">文件上传<input type="file">
<html> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="Text1.html"> <input type="text" name="username">文本框 <br> <input type="password" name="password">密码框 <br> <input type="submit"><!--提交--> <br> <input type="reset"><!--重置--> <br> <input type="button" value="点击"> </form> </body> </html>
单选框 <!-- name 用来给单选框分组 checked 表示默认勾选--> 多选框一样
<html> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="Text1.html"> 男 <input type="radio" name="sex" value="男"> 女 <input type="radio" name="sex" checked value="女"> <br> 唱歌 <input type="checkbox" name="hobby" checked value="1"> 跳舞 <input type="checkbox" name="hobby" value="2"> 游戏 <input type="checkbox" name="hobby" value="3"> 睡觉 <input type="checkbox" name="hobby" value="4"> </form> </body> </html>
（7）iframe（内嵌另一个页面）
6万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
