我们可以使用HTML，CSS，JavaScript搭建一个网页。使用HTML搭建网络框架，CSS渲染网页样式，JavaScript给网页添加交互。其中，仅靠HTML和CSS就可以生成静态页面。

HTML

HyperText Markup Language 超文本标记语言，可以理解为由一个一个的标签组成，一般标签的结构为<name>内容</name>

代码结构

doctype：标记我们的html文件使用什么版本，使得浏览器可以对应渲染出正确的版本。

html：根标签。

head：页面元数据，只不需要在页面中直接呈现给用户的信息。包括标题title，网页介绍之类的。

body：在页面中呈现的内容。

body中可以添加不同的语义化标签。存在很多既定常用的标签名，也可以自己定义标签名，但最终都希望能使网页结构能够更加清晰明了。

h1~h6标签： 一级标题到六级标题。一般网页中一级标题只有一个。

列表标签： 有序列表：ol内嵌li；无序列表：ul内嵌li；自定义列表是名字及其解释的组合。自定义列表以dl内嵌dt和dd，dt是名字，dd是对应的描述。

a标签： 超链接标签。重要属性href：跳转网址/其他文件；target：是否新开一个标签页跳转目标地址。

媒体标签： 图片标签：img；音频标签：audio；视频标签：video。

input标签： type属性很重要：text--文本；textarea 输入多行内容；checkbox--是否选择；radio--单选，名字相同的只能选一个；select option--下拉框；等等

文本标签： 段落标签：p；strong，em：强调标签；代码标签：code。

常用块元素标签：div；行内元素标签：span。

许多官方网站的网页结构几乎都由几个部分组成，每一个部分使用含有对应含义的语义化标签来搭建，例如网页头部header一般包含导航条nav，网页主体main，侧边栏aside，网页底部footer等等。

语义化标签的存在不仅使人们编写网页时更加的方便，也使我们阅读网页代码时更加容易理解每一个部分的具体内容代表什么含义，即使使用不同的标签使网页呈现了相同的样式，我们仍需思考选择哪一个标签更容易令网页结构被理解。