A、数据、服务器
1、上网就是请求数据，数据缓存。
2、服务器
服务器上面存放着网页相关的文件：包括HTML、CSS、JS文件、图片等。
当我们打开浏览器，输入网址，我们的计算机就会对这些文件发送HTTP请求
服务器收到这个请求之后，会把这些文件通过HTTP协议，传输到我们的计算机通道中，
然后，我们的浏览器再对这些文件进行渲染，呈递到页面上。
3、HTTP（超文本传输协议 ：Hypertext Transfer Protocol.）
比普通文本厉害的文本，就是超文本
4、HTML
业界的一个标准，网页技术的严格的三层分离：
HTML负责描述页面的语义；CSS负责面熟页面的样式；JS负责描述页面的动态效果；
所以：HTML不能让文字居中，也不能更改样式，比如颜色、字体，这都是CSS干的，也不能让盒子动起来，这是JS干的
也就是说：HTML只能干一件事情，通过标签对，给文本添加语义。
B、HTML
1、文档声明头
任何一个标准的HTML页面，第一行一定是
<!DOCTYPE ……>
作用：它可以告知文档用哪个类型的规范
我们之前所学的HTML，他是HTML4.01版本，也是从IE6开始兼容的，HTML5是从IE9开始兼容的。
有很多类型：
在HMTL4.01版本里面，有两种大规范，每个大规范里面有三个小规范，所以总共有6个规范。
HTML4.01它分为两种：普通的、以及XHTML。
HTML它觉得自己的规范不严谨
<h1><H1>
于是，诞生了一个严谨的规范：XHTML ，X代表的严格；
HTML 4.01 Strict 严格的
该 DTD 包含所有 HTML 元素和属性，但不包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional 普通的
该 DTD 包含所有 HTML 元素和属性，包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset 带有框架的
该 DTD 等同于 HTML 4.01 Transitional，但允许框架集内容。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
在HTML5里面，简化成了<!DOCTYPE html>，并且，向下兼容
2、字符集
<meta charset="utf-8" />
字符集用meta标签定义，meta代表“元”，“元”配置，便是基本的项目配置
Charset就是字符集合的意思，
在中文项目开发中，主要分为两种字符集：
1、 UTF-8：国际通用字库，涵盖了全球所有人类的文字语言。
2、 Gb2312:是国标，中国的字库，里面只包含所有汉子和常用的外文，比如日文片假名，还有一些常见的符号$￥。
字库的规模：UTF-8>gb2312
字库的选择，因为UTF-8涵盖的文字很多，所以臃肿，加载速度很慢，gb2312小巧，加载速度快很多
列子：
QQ网，网易，搜狐都是用的gb2312，他们追求显示速度、
新华网，用的UTF-8，保证字符集的数量。
2.1 关键字和页面描述
meta标签除了可以设置字符集，还可以设置关键字和页面描述
<meta name="description" content="网易是中国领先的互联网技术公司
为用户提供免费邮箱、游戏、搜索引擎服务,开设新闻、娱乐、
体育等30多个内容频道,及博客、视频、论坛等互动交流,网聚人的力量。" /
给页面设置这个描述，那么当你百度搜索的内容和这个相关，就会显示出你的页面，这个技术叫做“SEO搜索引擎优化”
定义关键字：
3. title标签
也能有助于SEO，
4. HTML，对换行不敏感，对空格，tab不敏感。当出现空格、换行的时候，会出现空白折叠现象。
5. HMTL标签
5.1 P标签
段落标签，他是一个文本级标签，里面只能放文字、图片、表单元素，其余一律不能放。
5.2 img
页面中可以插入图片的类型有：jpg,gif,png,bmp。
Html是不能直接放入图片，因为他是纯文本，所以只能插入图片路径，所以长传项目的时候，图片也要一起打包上传。
他是一个自封闭镖标签
自封闭标签和标签对的区别，标签对除了给页面添加语义，还要添加内容，自封闭标签只要添加语义就行了。
5.2.1 img标签属性
alt:替代
src:路径
当你需要返回上一层的时候，那么，就：../
相对路径绝对不会出现下列情况：
aaa/../bb/1.jpg
6. 超级链接
一个网站，他是由很多html页面组成的，html之间，是可以通过超链接相互跳转，形成一个“网”。
语法：<a href="index.html">主页</a>
a， 就是锚的意思
6.1 a标签的另外两个属性
title：悬停文本
target：是否在新窗口中打开。目标的意思
<a href="index.html" title="这是前往主页的" target="_blank">主页</a>
target="_blank" _blank他是一个固定的写法
6.2 锚点
页面中是可以有锚点的，所谓的锚点，就是一个小标记，这个标记用户不可察觉，可以通过name属性来设置，或者ID，如果a标签有name属性，那么就是页面的一个锚点
<a href="#md" target="_blank">前往锚点</a>
<a id="md">我是一个锚点</a>
最后，a标签是一个文本级标签，a的语义要小于p，a就可以当做文本来处理，所以p里面就相当于放的纯文字
正确：p包裹a
<p><a>段落</a></p>
错误：
<a><p>duanluo</p></a>
7. 列表（三种）
7.1无序列表
无序列表，用来定义一个列表的语义，并且每个项目和每个项目之间是不分先后的
Ul，无序列表
Li，列表项
7.2有序列表
Ol，有序列表
Li，列表项
有序列表用的不多，平时可以直接在ul里面加入数字代表序列
7.3定义列表
定义列表也是一个组标签，不过比较复杂，出现了三个标签：
dl:表示定义列表
dt：表示定义标题
dd：表示定义表述词
dt,dd只能在dl里面，dl里面只能有dt,dd,一个dt可以配多个dd
dt,dd 都是容器级标签，想放什么都可以，所以，现在我们应该注意并且了解：
【用什么标签，不是根据样式来决定，而是语义。】
8. div和span
div和span是非常重要的标签，div的语义的’分割’，span的语义是’范围、跨度’，在CSS里面，他们都是最重要的盒子。
Div是一个容器级标签，里面什么都可以放，包括他自己。
Span也表达一个小区域，小跨度，但是是一个文本级标签。
也就是说，span里面只能放文字、图片、表单元素，里面不能放p、h1-h6、ul、dl、ol、div。
Span里面是放小元素的，div里面是放大东西的。
我们日常的开发模式都称为：div+css布局，div负责布局，负责结构，负责分块，CSS负责样式。
9. 表单
表单就是收集用户信息的，让用户填写、选择的。
Form就是英语表单的意思，里面有action和method属性。Action就是表示，将要把表单提交到哪个地儿。Method属性表示用什么HTTP方法提交，有get和post两种方法。（在JS的AJXA里面详细介绍）。
9.1 文本框 <input type="text" />
Input表示输入，指的是这是一个“输入小部件”，
Type代表类型
Text，表示是一个文本。
这也是自封闭标签
还有默认值：value，就是框中已经填写好的内容。
9.2 密码框 <input type="password" />
9.3 单选按钮
<input type="radio" name="xingbie" />男
<input type="radio" name="xingbie" />女
只能选一个，术语叫做互斥，通过name来设置，name相同则互斥。
如果想要默认被选中，那么则加上checked
9.3 复选框
<input type="checkbox" name="aihao"/>睡觉
<input type="checkbox" name="aihao"/>吃饭
<input type="checkbox" name="aihao"/>打球
复选框最好也要给相同的name。
在html5里面，input类型会增加很多，在这里，我们先用这几个基本的
9.4 下拉列表
Select就是选择，option就是选项
Select标签和ul,ol,dl一样，都是组标签。我们可以用select做页面的分块布局
9.5 多行文本框（文本域）
Text就是文本，area就是区域
<textarea cols="30" rows="10"></textarea>
这个标签，是一个标签对，里面不用写东西，如果写了，就是默认文字。
Cols代表列，rows代表行。值就是一个数，表示多少行多少列。
9.6 三种按钮
按钮也是input标签，一共有三种：
普通标签：
<input type="button" value="我是一个普通标签" />
提交按钮：
<input type="submit" />
Submit就是英语提交的意思，这个按钮不需要填写内容就有提交的文字，这个按钮点击后，表单就会被提交到后台。
传统前端开发工程师，只需要关系页面的样式，板式，交互，数据的保存，读取，处理，都是后台做的，但是，我们后面会学（node.js，他是处理后台数据的框架），然后，我们怎么把数据给后台，通过两种方式，一种表单提交，另一种，ajxa.
9.7 label标签
在前面的单选按钮里面，有两个汉字，男、女，这两个汉字和input标签没有关系，那么，label就是解决这个问题的，
Input元素要有一个ID，然后label标签就有一个for属性，和ID相同，就表示绑定起来了。
什么表单元素都可以有label
9.8 重置按钮：
<input type="reset" " />
Reset复位的意思
Input类型：
Text,password,radio,checkbox,button,submit,reset。
10. HTML的废弃标签。
现在HTML只负责语义，而不负责样式，但是HTML一开始，连样式也包办了。这些样式标签，都已经被废弃了。
2004年前面的东西：
<font size="12" color="red">哈哈</font>
这些标签都是CSS钩子，而不是愿意：
<b>加粗</b><u>下划线</u><i>倾斜</i><del>删除线</del><em>强调</em><strong>强调</strong>
这些标签，有浓厚的样式作用，干涉了CSS的作用，所以HTML抛弃了他们。
<br /><hr />
网友评论