1、 浏览器
A、浏览器(browser) :万维网(Web)服务的客户端浏览程序。通过HTTP协议与网页服务器通信，并向万维网(Web)服务器发送各种请求，对从服务器发来的超文本信息和各种多媒体数据格式进行解释、显示和播放。
B、可以使用IETester工具，测试IE浏览器兼容问题(IE6 IE7 IE8共存)。
C、现在常用的浏览器引擎有Trident、WebKit。
2、静态网页与动态网页
A、什么是静态网页
使用HTML,XHTML,XML,CSS,JavaScript,Flash等不需要服务器端运算的程序实现的网页。
B、什么是动态网页
使用ASP,PHP,JSP等需要服务器端运算的程序实现的网页。
3、HTML基本结构
A、<HTML></HTML>
HTML标签放置于HTML文件的头尾，它的作用是告诉浏览器这个文件是HTML文件。
<HEAD></HEAD>
HEAD 标签一般在HTML标签和BODY标签的中间，是用来定义一些头部说明。
<TITLE></TITEL>
TITLE标签是用来定义这个HTML文档的标题，让浏览者访问网页时能够一下子明白网页的相关内容。它将显示在浏览器左上方。
<BODY></BODY>
在<BODY>标签里，可以定义网页的背景色，文字，链接等的颜色，甚至可以调入一些程序执行。在<BODY>和</BODY>中间，是网页的主要内容，是直接呈现给网友的部分。
4、HTML与XHTML
A、XHTML 要求正确嵌套
正确:嵌套元素
<p>Dragon <em>XHTML教程</em>.</p>
不正确:层叠元素
<p>Dragon <em>XHTML教程</p>.</em>
B、元素和属性名必须小写
对于所有HTML元素和属性名, XHTML文档必须使用小写。因为XML是大小写敏感的.如 <li> 和 <LI> 是不同的标签。
C、对非空元素,必须使用结束标签
在基于SGML的HTML4中的一些隐含结束意义的元素允许忽略结束标签.XML不允许忽略结束标签.除了在DTD中被声明为空的元素,所有元素必须有结束标签。
正确:结束的元素
<p>XHTML教程.</p><p> CSS教程.</p>
不正确:未结束的元素
<p>XHTML教程.<p> CSS教程.
D、属性值必须在引号中
所有的属性值必须在引号中,即使是以数字形式的属性值
正确:在引号中的属性值
<table rows="3">
不正确:不在引号中的属性值
<table rows=3>
E、属性最小化
XML不支持属性最小化.属性-属性值必须完整成对的写出.像disabled,checked这样的属性名不能在不指定属性值的情况下出现.
正确:非最小化属性
<input checked="checked">
不正确:最小化属性
<input checked>
F、元素必须被关闭
空元素必须有结束标签,或者起始标签必须以/>结束.例如,<br/>或<hr></hr>。
正确:结束的空元素
<br/><hr/>
错误:未结束的空标签
<br><hr>
G、用id 属性代替name 属性
HTML 4.01 针对下列元素定义 name 属性：a, applet, frame, iframe, img, 和map。
在 XHTML 中不鼓励使用 name 属性，应该使用 id 取而代之。
正确:
<img src="picture.gif" id="picture1" />
错误:
<img src="picture.gif" name="picture1" />
5、HTML的格式标签
A、<br/>回车，<p>分段。
<center>Dragon</center>居中显示。
h标签,HTML定义了<h1></h1>到<h6></h6>六个h标签，分别表示不同大小的字体。
<b>Dragon</b>粗体。
<font></font>字体标签。
B、URL、超链接
URL表示资源在网络中的地址。
超链接<a href="http://www.cnblogs.com/PBDragon">Dragon</a>。
图片超链接<a href="http://www.cnblogs.com/PBDragon"><img src="http://www.cnblogs.com/PBDragon/logo.gif"/></a>。
C、超链接(续)
"/"表示网站根目录，"../"表示父目录，"../../"表示父目录的父目录。
将<a>的target属性设置为"_blank/"在新窗口中打开超链接。
用name属性为<a>起名，<a name="last">这里是最后部分</a>。这样可以通过<a href="#last">转到..</a>来跳转到某部分。
D、列表、表格
列表:<li>表示列表项。<ul>表示无序排列，<ol>表示有序排列。即在<ul> </ul>中写入<li>可以构成一个无序列表，而在<ol> </ol>中写入<li>构成的是一个有序列表
表格:<table></table>为表格，通过<tr>创建行，<tr>内通过<td>创建单元格，将table的border属性设为0隐藏表格线。
<tr>的属性:align水平对齐，可选left、right、center；valign垂直对齐，可选top、middle、bottom。
<td>的属性:也有align、valign。
注意:子标签默认继承父标签的属性，如果自己单独指定了属性，则会覆盖父标签的属性。
6、表单
A、form标签用于为用户输入创建 HTML 表单。
表单能够包含input元素，比如文本字段、复选框、单选框、提交按钮等等。表单还可以包含 menus、textarea、fieldset、legend 和 label 元素。表单用于向服务器传输数据。
B、form的必要属性action
规定当提交表单时，向何处发送表单数据。
C、form的可选属性accept 规定通过文件上传来提交的文件的类型。
accept-charset服务器处理表单数据所接受的字符集。
enctype规定表单数据在发送到服务器之前应该如何编码。
method 以get、post方法发送表单数据。
name规定表单的名称。
Target 以_blank、_parent、_self、_top 规定在何处打开 action URL。
D、input标签用于搜集用户信息。
根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
E、input的type属性可选button、checkbox、file、hidden、image、password、radio、reset、submit、text 元素类型。
F、select 元素可创建单选或多选菜单。
当提交表单时，浏览器会提交选定的项目，或者收集用逗号分隔的多个选项，将其合成一个单独的参数列表，并且在将 <select> 表单数据提交给服务器时包括 name 属性。
如选属性：disabled 规定禁用该下拉列表。
multiple 规定可选择多个选项。
name 规定下拉列表的名称。
size 规定下拉列表中可见选项的数目。
option 元素定义下拉列表中的一个选项（一个条目）。
浏览器将 <option> 标签中的内容作为 <select> 标签的菜单或是滚动列表中的一个元素显示。option 元素位于 select 元素内部。
如选属性：disabled规定此选项应在首次加载时被禁用。
label定义当使用 <optgroup> 时所使用的标注。
selected 规定选项（在首次显示在列表中时）表现为选中状态。
value定义送往服务器的选项值。
G、TextArea标签定义多行的文本输入控件。
文本区中可容纳无限数量的文本，其中的文本的默认字体是等宽字体（通常是 Courier）。
可以通过 cols 和 rows 属性来规定 textarea 的尺寸，不过更好的办法是使用 CSS 的 height 和 width 属性。
必需的属性:
cols number 规定文本区内的可见宽度。
rows number 规定文本区内的可见行数。
可选的属性:
disabled规定禁用该文本区。
name规定文本区的名称。
readonly规定文本区为只读。
H、label标签为 input 元素定义标注（标记）。
label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。
注释："for" 属性可把 label 绑定到另外一个元素。请把 "for" 属性的值设置为相关元素的 id 属性的值。
7、CSS样式表
CSS（层叠样式表）用于美化页面，可以对页面元素进行更精细的设置，样式主要描述元素的字体颜色、背景颜色、边框等。CSS有以下三种方式来插入样式：
外部样式表
当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
内部样式表
当单个文件需要特别样式时，就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
内联样式
当特殊的样式需要应用到个别元素时，就可以使用内联样式。使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
8、DIV和SPAN
层:<div></div>将内容放到层中，就以将这些内容当成一个整体进行处理。Div是将内容放到一个矩形的区块中，会影响布局。
Span:只是把一段内容定义成一个整体进行操作，不影响布局显示。
9、CSS常见样式
1、CSS计量单位:CSS中表示宽度、距离时有多种计量单位:px(像素)、30%(百分比)、em(相对单位)等。常见:width:20px。
2、background-color:Red；背景颜色；color:文本颜色。
3、border-style:solid;边框风格，实线，还是dotted(点)等值；border-color:边框颜色；border-width:边框宽度。例子:style=“border-color:Red;border-width:1px;border-style:dotted;”
4、display:元素是否显示，可选值none(不显示)、block(显示为块级元素，此元素前后会带有换行符。)、inline(显示为内联元素，元素前后没有换行符)等。
5、cursor:鼠标在元素上时显示的光标图标，可选值:cursor(默认光标)、pointer(超链接)。
6、LI不显示圆点:LIST-STYLE-TYPE:none;一般设在LI或者LU上。
10、CSS样式选择器
selector有三种方式：HTML selector , CLASS selector , ID selector还有几个扩充的选择器：关联选择器，组合选择器，伪元素选择器。
HTML selector: 选择器 { 属性1：值；属性2：值 }
CLASS selector: .class（类别名称）{ 属性1：值；属性2：值；}
ID selector: #id（id选择器） { 属性1：值；属性2：值； }
注:在CSS中少用ID selector，但在javascrip里面会得已广范使用。因为可以根据这个ID值来操纵和定位这个特定的HTML标签。
关联选择器：指用一个空格隔开的两个或更多的单一选择器组成的字符串。
组合选择器：可以对多个标签对采用相同的样式。
11、样式优先级
[1位重要标志位] > [4位特殊性标志] > 声明先后顺序
!important > [ id > class > tag ]
使用!important可以改变优先级别为最高，其次是style对象，然后是id > class >tag ，另外，另外在同级样式按照申明的顺序后出现的样式具有高优先级。
4位特殊性标志 [0.0.0.0]
1、内联样式 [1.0.0.0]
2、ID选择器 [0.1.0.0]
3、类，属性，伪类选择器 [0.0.1.0]
4、元素标签，伪元素选择器 [0.0.0.1]
LVHA伪类,样式按LVHA优先级顺序从右至左覆盖，不同的顺序会产生不同的效果。
a:link - 默认链接样式
a:visited - 已访问链接样式
a:hover - 鼠标悬停样式
a:active - 鼠标点击样式