B/S网络模式（结构）C/S
B是浏览器Brower；S是服务器Server。 http://www.sohu.com/
HTML简介
静态网页的扩展名：.html和.htm (dos系统规定3个字母)
动态网页的扩展名：.asp、.jsp、.aspx、.php(含有PHP代码和MySQL代码)等
浏览器不能直接识别PHP和MySQL的代码。只能由服务器端的服务器软件Apache来进行解释成HTML代码返回。
1）HTML的概念
HTML(Hypertext Markup Language，超文本标注语言) ，(这是曾经的一道笔记题)
HTML就是一个标准，是一套标记。比如：加粗：<b>广州传智</b>
2）一个HTML文件的结构标记
<html>
<head>
<title>凤凰网首页</title>
</head>
<body>
99%的内容都放在这里
</body>
</html>
<html></html>是网页中最大的一对标记，告诉浏览器如何给我翻译这个文件的内容。<html>中包含两大标记<head>和<body>。
<head></head>中的内容不可见，一般用于特殊功能。
<body></body>是网页的主体内容。这里的内容都是用户可见的。
<title></title>是网页标题，只能填写纯文本。文件编码 字符编码
<meta>标记是<head>的子标记，告诉浏览器网页用什么字符编码来显示。比如：gb2312(简体中文)、utf-8(多国语言)
注意：如果这个<meta>标记，设置的不合格，会造成乱码的问题。(详细的meta明天再讲)
HTML标记的语法
双边标记：<标记名称 属性1=“属性值1” 属性2=“属性值2”></标记名称>
一个人可以看成一个对象，人对象有身高、体重、年龄、学历等特征。
例如：<张三 height=”180” weight=”200” age=”200” edu=”研究生”>
例如：<font size=”7” color=”red” face=“黑体”>李四</font>
单边标记：<标记名称 属性1=“属性值1” 属性2=“属性值2”>
说明：单边标记起一个特殊的作用，比如：换行标记、水平线等
例如：<hr> 水平线标记 <br>换行标记
字体修饰标记
加粗：<b>内容</b>
斜体：<i>内容</i>
下划线：<u>内容</u>
下标：<sub></sub>
上标：<sup></sup>
字体颜色、大小：<font size=“字号大小，取值1-7” color=“颜色单词”>内容</font>
例如：<font size=”6” color=”blue”>大家好</font>
解决网页乱码的问题：要保证各个环节的字符编码一致
编码分两 ：文件编码 字符编码
中文 文件ansi 字符编码：gbk（甲骨文），gb2312(普通的)
多国 文件 utf-8 字符: utf-8
（1）编辑器的编辑环境的字符集(默认字符集)：Ctrl+U
常用的编码 GB2312(简体)、GBK(简体)、BIG5(繁体)、UTF-8(多国语言编码)
（2）<meta>标记的字符集设定与编辑环境的字符集一致
字符集设置：<meta http-equiv=“content-type” content=“text/html;charset=utf-8”>
（3）PHP的字符集设置
（4）MySQL的字符集设置
注意：不需要考滤浏览器的字符集。
任何软件的默认字符编码都是ANSI编码，ANSI在中国，对应的具体的编码是GBK或GB2312。
<body>的常用属性
Text：指网页的前景颜色，就是指网页中的文本颜色；
bgColor：网页的背景颜色
background：网页背景图片路径。background=”images/bg.gif”
例如：<body bgcolor="#999999" background="bg01.jpg">
排版标记
1、水平线：<hr size=“线的粗细” width=“线的宽度” align=“水平对齐方式” noshade>
常用的属性：
Size：指定水平线的粗细，单位默认是像素，例如：size=5
Width：指定水平线的宽度，取值：固定值、百分比。例如：width=500 width=50%
Align：水平线的水平对齐方式，取值：left、center、right
Noshade：不加阴影，也就是纯色显示，该属性比较特殊，没有属性值。
提示：HTML中的标记及属性，不区分大小写。
例如：<hr size=“5” width=“50%” align=“center” noshade>
2、段落标记：<p></p>
Align：水平对齐，取值：left、center、right
提示：在段落的前后，会自动插入一个空行。
3、标题标记
一级标题：<h1 align=“left|center|right”></h1>
二级标题：<h2></h2>
三级标题：<h3></h3>
四级标题：<h4></h4>
五级标题：<h5></h5>
六级标题：<h6></h6>
4、预排版标记<pre></pre>
含义：将保留其中的所有的空白字符(空格、换行符)。原封不动的输出结果。
说明：真正排网页过程中，<pre>标记几乎用不着。但在PHP中用于打印一个数组时使用。
HTML字符实体
空格：
>：>
<：<
&：&
人民币：¥
版权：©
乘号：×
除号：÷
项目符号(无序列表)标记
标记结构：
<ul>
<li>内容</li>
<li>内容</li>
……
</ul>
常用属性：
Type：指定项目符号的类型，取值：disc(实心圆点)、circle(小圆圈)、square(方块)
提示：这个type属性，既可能给<ul>添加，也可以给<li>添加。
注意：项目符号可以是图片，但是通过CSS设置<li>标记的背景图片来实现。(CSS中讲)
项目符号之间相互嵌套
<ul>
<li><b>北京市</b>
<ul>
<li>海淀区</li>
<li>朝阳区</li>
<li>东城区</li>
</ul>
</li>
<li><b>广州市</b>
<ul>
<li>天河区</li>
<li>越秀区</li>
</ul>
</li>
<li>天津市</li>
</ul>
说明：项目符号嵌套，是在某一个<li>标记中来嵌套一个完整的<ul>标记。
编号列表(有序列表)标记
<ol>
<li>内容</li>
<li>内容</li>
……
</ol>
常用的属性：
Type：编号的类型，取值：1、a、A、I(大罗马)、i(小罗马)
Start：从第几开始编号，取值只能是数字。
<h2>编号列表的应用</h2>
<ol>
<li>HTML</li>
<li>CSS</li>
<li type="a" start="3">JavaScript</li>
<li>PHP+MySQL</li>
</ol>
编号列表相互嵌套：跟上面<ul>的嵌套一样，也都是在<li>标记中，来嵌套一个完整的<ol>。