html基础
B/S结构网络模式
Browers(浏览器)，Server（服务器），是web后出现的一种网络结构模式。
这种模，在客户端只需要安装浏览器，剩下的工作都交给服务器来处理。
好处：客户端的压力、负荷很小、降低我们的使用成本。
B/S结构的工作原理：
（1）首先是WEB浏览器向服务器端发出请求。在浏览器的地址栏里输入网址或IP地址。每台计算机都有一个唯一的IP地址，那网址是和IP地址是一一对应的。IP地址的形式192.168.0.345，域名www.baidu.com、www.sina.com.cn
DNS域名解析器：是当你在地址栏输入域名后，将该域名转换成对应的IP地址。
（2）服务器接受请求，第一种：如果该文件是纯静态的网页(.htm或.html)，服务器直接返回；如果请求的文件是.php、.net后缀的文件(服务器端脚本程序，由服务器来处理)，先进行相应的处理，把处理的结果返给你。但是在服务器端还有一项功能：如果你访问的程序文件含有数据库内容，服务端去向数据库发出请求，将请求的结果返回给服务器端调用程序。数据库是：存储网站数据的地方(MySQL、ACCESS)。
（3）WEB服务器将查询到的结果，再返回给WEB浏览器。WEB浏览器将结果显示出来。WEB浏览器是一种解释器，或者叫翻译器。
HTML
HTML（HyperText Markup Language），超文本标注语言。是一种标准，是一种规范，是用于显示网页上各元素的标准。
标注：又叫标记，或叫标志。比如：<b>内容</b><font color=”red”>中国</font>
浏览器是一种解释器，HTML标记，它就是告诉浏览器，这个内容该如何显示？
超文本：就是加“超级链接”的文本就是超文本。
语言：不是我们所理解的编程语言，只是一标注语言。程序语言（PHP、C、JAVA）。
静态网页扩展名：.htm .html
动态网页扩展名：.php .net
HTML文件的代码结构
一个HTML文件的结构是
<html>放在文件头部
<head>
文件头内容
</head>
<body>
文件主体内容
</body>
</html>放在文件尾部
<html></html>含义：告诉浏览器，当遇到<html>标记时，把其中的所有内容按网页格式来翻译。
<head></head>叫文件头部标记。作用：是发送给浏览器的一些控制信息。
<body></body>叫文件主体内容。
HTML标记的语法
每一个标记都包围在< >内：<b>内容</b>中国
每个标记都可能有结束标记(又叫双边标记)：有开始标记<b>，有结束标记</b>
斜体文字：<i>文本内容</i>
每一个标记还可能有属性：<font color=”red”>内容</font>
语法格式：<开始标记 属性=属性值 属性=属性值>内容</结束标记>
属性是对标记的更多的限制。
保存快捷键：Ctrl+S
网页乱码的解决：保证网页文件的<meta>标记的编码与网页保存时的文件编码是否一致。如果不一致，将可能会产生乱码。
代码编辑器
作用：用了代码编辑器，可以加速网页代码的编写效率。
分类：一种是IDE集成开发环境，一种是增强的文本编辑器。
介绍几种代码编辑器
1) EditPlus：比较小、占用系统资源少，语法高亮显示，自动缩进等功能。但没有代码自动补齐功能。Mysql_fetch_array()。
2) Notepad++：与EditPlus相似。
3) Dreamwear：有可视化视图、有代码视图。比较大，占用系统资源相对多些。语法高亮有，代码自动补功能。
4) Zend Studio：是IDE开发环境，是常获PHP集成开发环境软件大奖。代码自动补齐功能。
EditPlut
1）常用的快捷键
新建：Ctrl+N
保存：Ctrl+S
撤消：Ctrl+Z
重做：Ctrl+Y
查找：Ctrl+F
替换：Ctrl+H
复制当前行：Ctrl+J
Tab:缩进
Shift+Tab：向左缩进，向上缩进
2）EditPlut的基本设置：工具——参数设置
背景颜色、字体、大小、行高、布局设置
HTML的标记编写规范
1） 不区分大小写，但是尽量用小写，为了与XHTML、XML的兼容；
2） 每个标记使用< >括起来；比如<b>加粗
3） 每个标记可能有结束标记(双边标记)，也可能没有(单边标记)。
双边标记：<div></div>
单边标记：<br />换行 <hr>水平线 <img>图片
4)每个标记可有属性，也可以没有属性，也可能有多个属性
<font size=”5” color=”red” face=”宋体”></font>
属性和标记，以及属性间用空格隔开，空格可以多个。
5）每个属性值加引号。
HTML将来会被XHTML替代。
5) HTML标记的多少固定的，不能人为定义。
6) 标记之间要能顺序嵌套：<p><b>内容</b></p>
错误写法：<p><b>内容</p></b>
字体修饰标记(标签)
加粗：<b>内容</b>
斜体：<i></i>
下划线：<u></u> underline
字体：
l 大小size属性，取值1－7；
l 属性face设置字体，比如“黑体”
l 颜色属性：值可能是单词、十六进制。比如：red、blue、green ；十六进制
sup：上标 a<sup>3</sup>
sub：下标 a<sub>2</sub>
换行和段落：
<br>换行标记
<p></p>标记
换行和换段区别：段落间会有一个空行，但换行，没有距离。
标题标记：
<h1>一级标题</h1>自动加粗
<h2></h2>
<h3></h3>
<h4></h4>
属性： align= left | right | center
网页颜色
网页颜色有三种表示法：
1）单词表示法：red、 blue、green、gray、orange
2）十进制表示法：rgb(233,45,200)
3）十六进制表示法：#FF0000(红色)
自然界中所有的颜色都可以用RGB三种颜色混合而成，RGB又加三原色，还叫加色模式，根据光的波长不同而产生不同的强度的光的颜色。
加色模式：红色+绿色＝黄色
每一种原色可有256(0-255)种，RGB共可以混合出256*256*256=1670万
红色：RGB(0,0,0) RGB(255,0,0)
绿色：RGB(0,0,0) RGB(0,255,0)
蓝色：RGB(0,0,255)
黄色：RGB(255,255,0)
紫色：RGB(255,0,255)
青色：RGB(0,255,255)
十六进制：基数 0－9 A-F
前两位代表R，中间两位代表G、最后两位代表B
#FF0000红色
#00FF00 绿色
#0000FF 蓝色
预排版标记<pre></pre>是双边标记
在该标记内，所有空格都将保留。
普通标记：说明一个问题，换行必须要有换行标记<br />，换行必须要用换段标记<p></p>。所有格式内容都要有相应的标记来处理。
<pre>平常用的比较少，一般情况下在PHP中做为输出数组来使用。
三个<Meta>标记
1)设定网页的编码标准
<meta http-equiv=”content-type” content=”text/html;charset=utf-8”>
2)设定网页关键字，是给搜索引擎，比如：baidu.com、google
<meta name=”keywords” content=”PHP,教育,培训,传智”>
关键字的设定：一定精简，真正能体现公司的服务或者项目的。
3）网页描述
<meta name=”description” content=”这里是网页描述”>
描述内容不能写的太多，一般不超过100个字符。
项目符号列表<ul>
语法格式：
<ul>
<li>内容</li>
</ul>
说明：
1) 项目符号是一个组标记，是由<ul>和<li>构成。
2) 每个项目的内容要放在<li></li>标记中
3) <ul>标记的属性 type：square(方块)、circle(圆)、disc（实心圆点）
<ul type=”square”></ul>
4）一个ul可以有多个<li>标记
<hr />水平线：画一条水平线
编号列表标记<ol>
语法格式：
<ol>
<li>内容</li>
<li>内容</li>
</ol>
说明：
1) 编号列表分类：数字(3)、大写字母(A)、小写字母(a)、大罗马(I)、小罗马(i)
<ol type=”a”></ol>
2)起始属性 start=”4”
定义列表<dl>，也是一组标记，不是单个的。
语法格式：
<dl>
<dt>小标题</dt>
<dd>对小标题的说明内容</dd>
<dl>
举例：
<dl>
<dt>HTML的概念</dt>
<dd>HTML是超文本标注语言，是一个标准，是用于显示网页各部分的语言。</dd>
</dl>
注意：在<dl>中至少有一个<dt>和<dd>，可以包含多个。
应用：在JD的左侧商品菜单。
进制介绍
十进制：基数0、1、2……9，规则是逢十进一。
二进制：基数0和1。规则是逢二进一。
八进制：基数0－7。规则是逢八进一。
十六进制：基数0 1 2 3 4 5 6 7 8 9 A B C D E F规则逢十六进一。
计算机的存储里，如果我们把它拆开，除了盘片，什么也看不见。你用放大镜把盘片放大，会发现凹凸不平。二进制代表两种状态，是与否，或者对与错，也可能说是开与关。凹代表0（没有），凸代表1（有东西）。二进制比如110101010101011010010101010。
我们在计算机的应用层，使用很多字符、数字、符号，计算机不能直接识别，要进行相应的转换。中文搜索器的开发。如果我们用英语来写文章的话，搜索速度要至少快一倍以上，道理是美国人。
字符编码：我自己定义一个110代表a。汉字编码：
八进制：是用3位二进制来表示，也就是2^3来表示。
十六进制：是用4位二进制来表示，也就是2^4来表示。
将10进制转换成二进制
10进制转成二进制：分整数部分和小数部分。比如：(10.125)10
将整数转换成二进制的方法：除2取余法，直到商为0。按倒序来进行组织成二进制：(1010)2
|
第N次 |
商 |
余数 |
|
|
|
1 |
5 |
0 |
|
|
|
2 |
2 |
1 |
|
|
|
3 |
1 |
0 |
|
|
|
4 |
0 |
1 |
|
|
将小数转成二进制的方法：乘2取整法，直到小数后为0为止。
按顺序来进行组织二进制的结果是：001
|
第N次 |
积 |
整数 |
|
|
|
1 |
0.25 |
0 |
|
|
|
2 |
0.5 |
0 |
|
|
|
3 |
1 |
1 |
|
|
十进制(10.125)10转成二进制是1010.001
二进制转成十进制
转换的方法是：按位权相加
1010.001
位权：是从小数点位置开始算起，向左正整数递增；向右是负整数递减。
1*2^3+0*2^2+1*2^1+0*2^0=8+0+2+0=10
计算机编码
目的：是为解决你网页中出现乱码的问题。
计算机只能处理二进制数据，那么计算机如何处理数字、字母、符号、以及汉字呢？这个就必须要进行编码处理。例如：65代表A。W3C国标标准化组织，由他制定和发布相关的统一标准，然后大家都去遵守他的标准。
计算机最初是由美国人发明的，他们的语言：由26个字母组成。最初时的计算机编码是ASCII码，是由美国人制定的。包括：26大小写字母、一些符号、一些控制符号(不可见)。它用2的7位(128个字符)或8位(256个字符)来进行表示。
计算机被引入到了其它国家，比如中国。我们国家信息标准化局制定了咱们自己的计算机编码：GB2312码。比如，日本也有自己的编码。但是每个国家的编码并不兼容。GB2312码是两个字节，它一共可以存储6764个汉字。
有些罕见的汉字，还有少数民族的语言或符号，还是不能处理。因为标准化局对GB2312编码进行了扩充，扩充后GBK。GBK兼容GB2312。
还有一个ANSI编码，是跟随操作系统来运行的。比如：在中国我们的操作系统是简体中文的，那ANSI编码就代表GB2312。比如：日本的操作系统使用的ANSI编码，JIS编码。以上所述，发现一个问题：每个国家都根据自己国家的语言习惯制定了自己国家的编码，造成不同国家编码不能相容的问题。
补充：一个汉字是两个汉字，一个字节是8位二进制，共16位二进制。
台湾、香港它们用的繁体，但GBK、以及GB2312还是无法处理。
当时，在台湾地区，可以说每个公司都有自己的编码。有五家公司佳佳、大众等，联合制定了一个标准，后来叫BIG5，中文名称大五码。
但是又出来一个，当这些国家的计算机进行交互时，或者交流时，出现了问题，每个国家的编码互不兼容。W3C发现这个问题，并制定了一个标准Unicode(统一)，按4个字节进行编码。比如：1在ASCII中有8位就可以表示，但Unicode用32位表示0000000000000001。Unicode包含全世界所有的语言，它有自己的缺点：标准内容大约有500页左右，太大了。这样一样，就浪费了很多的网络资源。后来又出现了UTF-8(统一转换格式)，优点字节长度自适应。
乱码的解问办法：
1) 保证网页中的编码和文件编码一致
2) 比如网页中的编码用UTF-8，保存网页时，也要用UTF-8。也就是保存与网页要一致。与浏览器可以不一致。浏览器是根据网页的编码来进行解析网页的。
ASCII码：
ANSI码：
GB2312（标准码）
GBK(标准扩展码)
Unicode（统一编码）
UTF-8
