web快速入门之基础篇-html：1、初见 html 基本文档结构、开发工具、详细解释

这几年经历裸辞、创业、进创业公司然后被拖欠工资等等事情，真的是一波三折，但是写博客这件事情不能落下。web前端其实还算接触的比较早，最早的时候08年、09年上大学的时候就学过玩过，现阶段做Android项目开发经常会碰到混合开发一个人干的事情而且web-h5依然很火热，不妨从今天开始把以前的一些笔记整理一下。最大的学习经验就是要写博客，做笔记，写博客不仅仅是记录，也是总结提炼，在写的过程中，融入自己的思考，加深对技术的理解

二、简单实例介绍

实例：3秒自动跳转

我们先来看看一个例子，如下代码：01_基本文档结构_3秒自动跳转.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
	<head>
		<title>这是title标题</title>
		<!-- 内容类型；纯文本html；字符类型utf-8 -->
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<!-- 刷新；3秒后刷新跳转到指定url， url属性必须包含在content属性里面，否则没效果 -->
		<meta http-equiv="Refresh" content="3;url=http://www.w3school.com.cn" />
	</head>
	<body>
         !DOCTYPE 、html、head、body、title、meta标签的使用
	</body>
</html>

用浏览器打开运行，3秒后它会跳到 W3School官网。很简单，这里就不演示贴图了！

使用工具：Visual Studio Code

这里web前端的编辑器，之前我在写 vue 系列专题推荐的是 IntelliJ IDEA，Vue框架项目实战整理：1、Vue开发工具介绍、快速启动、常见错误但是刚刚整理笔记的时候我的mac使用它打开文件夹就一直响，启动有点卡顿，差不多1.5w入手的mac应该配置还行吧，于是eclipse、Sublime Text、Visual Studio Code都试了试，感觉Visual Studio Code体验好一点，没必要在开发工具上一直纠结，再者前段时间整理 nodejs 技术点也用的它，所以就不使用 IntelliJ IDEA了，就用Visual Studio Code吧，当然这看个人喜好和使用体验，你用记事本也行。

三、要点说明

（一）快速手动构建，html基本文档结构

基本思路：

1. 复制<!DOCTYPE>标签内容

2. <html>标签，指定文档的开始点和结束点

3.<head>标签，定义文档的头部。指定title、meta

4.<body>标签，定义文档的主体

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
	<head>
		<title>这是 title 标题</title>
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	</head>
	<body>
         这是 body 部分
	</body>
</html>