1.<!DOCTYPE html>
告知浏览器以哪种规范来解析html文件
2.head标签
<meta>标签
<meta>标签有2个属性,分别是http-equiv属性和name属性,不同的属性有不同的参数值
name属性主要用于描述网页,与之对应的属性为content,主要内容是便于搜索引擎机器人查找信息和分类信息
<meta name='keyword' content='关键词'> <meta name='discription' content="描述语句">
http-equiv属性相当于http文件头作用,可以向浏览器传回一些有用的信息,以帮助精确的显示网页内容,与之对应的属性为content
<meta http-equiv='Refresh' content="秒数;url" > 跳转网页时使用,在指定的秒数后跳转到指定的网站,不加url会在指定的秒数后刷新 <meta http-equiv='concent_Type 'charset="UTF-8"> 指定编码方式
<title>
<title>标签,设置网页的标题
<link>
link> 设置标题图片连接
<link rel='icon' href=图片的Ip地址或者路径> 以连接形式将图片放到网页显示,这里是显示在标题的图片上
3.body标签
注意:
所有标签被分为块级标签和内联标签,块级标签通常占用一片区域,内联标签占用与标签体大小相同的区域
<h*>
<h1> <h2> <h3> <h4> <h5> <h6>
设置标题的标签,根据数字越大,标题号显示的字体越小,字体加黑加粗
<hr/>
在标签上打印一条横线
<br/>
浏览器解析时,换行符解析为空格,还是在同一行,想要将字符多行显示,在后加<br/> ,换行标签
<p>
换行标签,换行的同时,在行与行之间带有空格显示
<div>
什么效果都没有,但是div时一个块级(block)标签,它控制的不仅仅是标签体,通常是一块一行的区域,它控制的区域别的标签都不能使用
可以按照自己的想法对标签体进行设计,通常与span配合使用
<span>
也不自带效果
内联(in-line)标签,占用的区域根自己的字符大小有关,有多少大小,就占用多少区域
<b>
字体加粗标签
<em>
字体变斜体标签
<strike>
去除标签,在标签体中画一道横线,不建议使用,大多使用<del>
<sub>
下角标,如2<sub>3</sub> 3在2的右下方
<sup>
上角标,如2<sup>3</sup> 2的3次方,3在2的右上方
  (特殊符号)
在html中,字符之间的多个空格只能显示出一个,如果想要显示多个空格,使用 ,代指空格
©
版权符号(特殊符号还有很多,用到哪个查哪个)
<img/>
在html插入图片 <img src=图片路径>
还可以对图片的大小进行设置<img src=图片路径 width=长度(单位px) height=高度(单位px)alt=字符(图片加载不出来显示)title=字符串(图片的名字)>
执行到Img时,程序需要到指定位置加载图片,耗时较长,会专门新开一个线程来完成图片加载
<a>
两个功能:超链接,锚
1.超链接属性<a href=url>链接文本</a>,如<a href='www.baidu.com'>百度</a>
可以添加属性 target='_blank' 在新的窗口里打开超链接
2.实现一篇长文章的快速滑动,跳转到指定位置<a href=#标签名>标题名</a> 点击标题名后直接跳转到指定的标签
<ul>
无序列表,其中的标签无序排列显示
在显示的时候不添加数字开头1,2,3,4
<ol>
有序列表,其中的标签按顺序排列显示
在显示的时候添加数字开头1,2,3,4
注意(ul标签和ol标签中的标签都是li标签)
<dl>
定义列表
以显示目录的情况显示文本
其中包裹<dt> 以标题形式 <dd> 普通的文本
<table>
表格形式
<form>
表单标签,用于向服务器传送数据
通过标签向服务器提交数据时要在<form>里进行设置
属性method,可以为get或post.设置数据提交的方式
get,将数据以键值对的形式放在地址栏的url后,直接发送给服务器
post 将所有要发送的数据进行封装,放在请求体中发送给服务器
属性action里存放的数据要提交给哪个url,想要交互的网址
<input/>
输入框标签们可以通过属性type修改输入框的类型
其中type="submit"类型的按钮可以提交form表单的数据
<input type="checkbox",name='xxx',vulues=''xxx>
上放代码是复选框,可以选择多个,形状为方形
复选框中标识数据时,name都是相同的,vuales值各不相同 ,选择一个,values=xxx,选择多个,values=[xxxx,xxx..],根据values的值来判断选择的是哪些复选框
当选中一个多选框时,该多选框的checked属性变为true,取消选择时,checked=false,可以用来改变多选框的选中状态
注意:name属性是给服务器看的,作用是具体标识收到的值都是哪个标签发来的。因此 input类型的一些标签都要带有name属性
以键值对的形式将name和值发给服务器
<input type="radio" ,name=xxx,values=xxx>
上方代码是单选框
多个选择框添加name属性,并且name属性值相同,values的值各不相同
最终发送时values的值只能有一个,它必须为单选框
<input type="file">
上传文件,发送的文件被封装在rep.files中,以for循环再get获取文件,再新建一个文件从新写入收到的数据即可
<input type="reset">
重置Input标签中已经填入和选择的数据
<select>
下拉选框 ,可以在多个下拉列表中选择一个数据
其中包裹着<option> 标签 ,内容就是下拉选框中的一个值
name属性要定义在select中,values要分别定义在option中,如下:如果选择北京,向服务器发送的数据就是city:['beijing']
<select name="city" > <option value="beijing">北京</option> <option value="shanghai">上海</option> <option value="hefei">合肥</option> </select>
如果想在下拉选框中选择多个数据,就只要在select中加入multiple标签,后面可加size属性,设置一次最大显示几个内容
<select name="asdsa" multiple size="5">
如果选择的值其下还有其他分支
在其标签下添加<optgroup label="dfd"></optgroup>,就会使该选项无法被选择,成为标题作用
<testarea>
文本框,可以设置文本框的大小,几行几列
<textarea rows="20" cols="20"></textarea>
<lable>
将文本与标签链接在一起,点击文本就是点击标签
<lable for=标签id>文本</lable>
<table>
表格标签,表示表格,表格的所有内容需要写在 <table> 和 </table> 之间
<tr> 是 table row 的简称,表示表格的行。表格中有多少个 <tr> 标签就表示有多少行数据。
<td> 是 table datacell 的简称,表示表格的单元格,这才是真正存放表格数据的标签。单元格的数据可以是文本、图片、列表、段落、表单、水平线、表格等多种形式。
<th> 是 table heading 的简称,表示表格的表头。
rowspan:表示跨行合并。
colspan:表示跨列合并
<tr> <th>姓名</th> <th>性别</th> <th>学号</th> </tr> <tr> <th rowspan="2">1</th> <th>2</th> <th>3</th> </tr> <tr> <th colspan="2">4</th> </tr>