head 标签用于定义文档的头部，它是所有头部元素的容器。head中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。文档的头部描述了文档的各种属性和信息，包括文档的标题、在 Web中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。 定义文档的标题，它是 head部分中唯一必需的元素。

 

　　下面这些标签可用在 head 部分：， , , , ,

 

　　body元素定义文档的主体。body元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等）

 

　　body一般有2种标签：块级标签和内联标签

 

　　block（块）元素的特点

 

　　① 总是在新行上开始；

 

　　② 高度，行高以及外边距和内边距都可控制；

 

　　③ 宽度缺省是它的容器的100%，除非设定一个宽度。

 

　　④ 它可以容纳内联元素和其他块元素

 

　　inline元素的特点

 

　　① 和其他元素都在一行上；

 

　　② 高，行高及外边距和内边距不可改变；

 

　　③ 宽度就是它的文字或图片的宽度，不可改变

 

　　④ 内联元素只能容纳文本或者其他内联元素

 

　　对行内元素，需要注意如下

 

　　设置宽度width 无效。

 

　　设置高度height 无效，可以通过line-height来设置。

 

　　设置margin 只有左右margin有效，上下无效。

 

　　设置padding 只有左右padding有效，上下则无效。注意元素范围是增大了，但是对元素周围的内容是没影响的。

 

　　inline-block元素的特点

 

　　这个需要css的display来指定，我们有时候既希望元素具有宽度高度特性，又具有同行特性，这个时候我们可以使用inline-block。在CSS中通过display:inline-block对一个对象指定inline-block属性，简单来说就是将对象呈现为inline对象，但是对象的内容作为block对象呈现。之后的内联对象会被排列在同一行内。比如我们可以给一个link（a元素）inline-block属性值，使其既具有block的宽度高度特性又具有inline的同行特性。

 

　　最后稍微说一下display:none,这个就是把元素隐藏掉，常用在模态上，添加此属性让元素隐藏

 

　　案例：

 

　　html的特殊符号编码

 

　　参考这个博文：

 

　　HTML特殊符号汇总

 

　　锚

 

　　通过点击锚1、锚2可以实现页面位置的跳转

 

　　各种标签示范

 

　　效果示范：

 

　　表单用于向服务器传输数据。表单能够包含input元素，比如文本字段、复选框、单选框、提交按钮等等。表单还可以包含textarea、select、fieldset和 label 元素。

 

　　表单属性

 

　　HTML 表单用于接收不同类型的用户输入，用户提交表单时向服务器传输数据，从而实现用户与Web服务器的交互。表单标签，要提交的所有内容都应该在该标签中。

 

　　action: 表单提交到哪。一般指向服务器端一个程序，程序接收到表单提交过来的数据（即表单元素值）作相应处理。

 

　　method: 表单的提交方式 post/get 默认取值 就是 get

 

　　get:

 

　　1.提交的键值对。放在地址栏中url后面。

 

　　2.安全性相对较差。

 

　　3.对提交内容的长度有限制。

 

　　post:

 

　　1.提交的键值对 不在地址栏。

 

　　2.安全性相对较高。

 

　　3.对提交内容的长度理论上无限制。

 

　　get/post是常见的两种请求方式。