(1).换行<br>
格式：<br>
(2).段落<p>
格式：<palign=”排列方式”>…</p>
Align属性：
left 往左靠（默认）
center 往中靠
right 往右靠
(3).水平直线<hr>
格式：<hr>
属性
size 像素绝对设置，以数字表示，属性值越大，线越粗
百分比相对设置，以%表示，属性值越大，线越粗
width 像素绝对设置，长度不会应视窗的改变而改变
百分比相对设置，长度会随着视窗宽度而改变
noshade 实体线
color
(4).背景色与文字设置
格式：<bodybgcolor=”背景色” text=”文字颜色”>
整体页面的边距，行距
<body leftmargin=”像素” topmargin=”像素”>
(5).标题文字设置
格式：<h1>…</h1>
<h2>…</h2>
<h3>…</h3>
<h4>…</h4>
<h5>…</h5>
<h6>…</h6>
属性
align left 靠左
center 靠中
right 靠右
(6).特殊字符设置
格式：
< lt;
> gt;
& amp;
“ quot;
(7).实体字符控制标记
1.<b>…</b> 粗
2.<i>…</i> 斜
3.<s>…</s> 删
4.<u>…</u> 下划
5.<sub>…</sub> 下标
6.<sup>…</sup> 上标
(8).语意字符控制
1.<address>…</address> 地址(倾斜)
2.<big>…</big> 大字
3.<del>…</del> 删除
4.<ins>...</ins> 修改
5.<small>…</small> 小字
6.<strong>…</strong> 加强语气(加粗)
7.<em>...</em> 加强语气(倾斜)
(9).格式化
格式：<pre>…</pre>
让书写的文字格式化！
(10).引用文本
格式：<blockquote>...</blockquote>
属性 名称属性值说明
cite url 被引用的地址
(11).无序号条例式<ul><li>
格式:
<ul>
<li>…</li>
<li>…</li>
<li>…</li>
<li>…</li>
</ul>
功能: <ul>无序条列清单的开始.
</ul>表示结束.
<li>…</li>表示一个项目.
<li>的属性
属性 名称 属性值说明
type dise 实心圆(默认值)
circle 空心圆
square 实心方块
(12).有序号条例式<ol>与<li>
格式:
<ol>
<li>…</li>
<li>…</li>
<li>…</li>
<li>…</li>
</ol>
功能: <ol>有序条列清单的开始.
</ol>表示结束.
<li>…</li>表示一个项目.
<ol>的属性
属性名称 属性值 说明
type 1 表示以1,2,3,4 来表示
a 表示以a,b,c,d 来表示
A 表示以A,B,C,D 来表示
i 表示以i,ii ,iii 来表示
I 表示以I,II,III 来表示
(13).叙述式(定义列表)
格式:
<dl>
<dt>…</dt>
<dd>…</dd>
<dd>…</dd>
<dd>…</dd>
<dt>…</dt>
<dd>…</dd>
<dd>…</dd>
<dd>…</dd>
</dl>
功能: <dl>叙述清单的开始
<dt>表示一个项目
<dd>表示一个项目下的更详细的内容
表格
1. 表格的基本格式
格式:
<table>
<tr>…
<th>… </th>
<th>… </th>
<th>… </th>
</tr>
<tr>
<td>… </td>
<td>… </td>
<td>… </td>
</tr>
</table>
功能:<table>…</table>用来声明表格开始与结束.
<tr>…</tr>用来设置表格的行.
<th>…</th>用来设置标题栏位.
<td>…</td>用来设置数据栏位.
2. <table>标签下的属性
表格布局cellspacing=0cellpadding=0 border=0
属性名称 属性值 说明
border 像素 设置表格的边线
cellspacing 像素绝对 设置,存储格框线宽度
百分比 相对设置,存储格框线宽度
cellpadding 像素 绝对设置,数据与框线的距离
百分比 相对设置,数据与框线的距离
width 像素 绝对设置,像素表示表格宽度
百分比 相对设置,百分比表表格宽度
height 像素 绝对设置,像素表示表格宽度
百分比 绝对设置,百分比表表格宽度
align left 表格往左靠(默认)
center 表格往中靠
right 表格网右靠
bgcolor 英文/十六进制数 表格的背景颜色
background URL 表格的背景图片
summary 字符串 用来描述表格数据说明
bordercolor 英文/十六 边框的颜色
bordercolorlight 同上边框的亮色
bordercolordark 同上边框的暗色
3. <table>标签下的边框设置
该属性必须在border
的属性值不为0 的状
态下
属性名称 属性值 说明
frame void不要显现表格的边线
above 只要显现出表格的上边线
below 只显现出表格的下边线
hsides 只显示表格的上下边线
vsides 只显现表格的左右边线
lhs 只显现表格的左边线
rhs 只显现表格的右边线
border/box 会显现出表格的所有边线
rules rows只显示出横行的格框线
cols 只显示出直行的格框线
all 显示全部格框线
groups 表示列组合水平部分
none 不显示任何格框线
4. 拆分与合并单元格
要被合并的单元格先删除td
属性名称 属性值说明
colspan 数字向两边扩展栏位
rowspan 数字向下扩展栏位
5. 表格的结构化、直列化、标题
(1).结构化格式：
<table>
<thead>……</thead> --------表头区
<tbody>……</tbody> --------表体区
………………………
<tfoot>……</tfoot> --------表尾区
</table>
(2).直列化格式：<colgroup>….</colgroup>
属性名称属性值说明
align left 靠左
center 靠中
right 靠右
valign top 靠上
middle 靠中
bottom 靠下
span 数字直列数目
width 像素/百分比宽度
个别直列设置
格式:<col>功能完全和<colgroup>一样.
<col span=2></col>
(3).表格的标题：
<table>
<caption>….</caption>
</table>
<caption>下的属性值有:
属性名称 属性值说明
align top标题在表格上方
bottom 标题在表格下方
超链接
1. 超链接的种类
一般常用的分为四种:
1. http
声明<ahref=http://www.163.com/images/logo.htm>网易logo</a>
2. file
声明<ahref=file:///e/images/pic.jpg>图片</a>
3. ftp
声明<a href=ftp://192.168.4.21/>进入</a>
4. mailto <a href=mailto:xx@163.com>E-MAIL</a>
2. 书签的链接
<a>下的属性
属性名称属性值说明
name 字符串设置超链接的标记
基本格式：
瞄点<a name=”音乐”>…</a>
链接点<a href=”#音乐”>…</a>
链接到别的网页的书签项目：
基本格式：
瞄点<a name=”音乐”>…</a>
链接点<a href=”index.htm#音乐”>…</a>
3. 基准参考点
基本格式：<head>
<base href=”c:\”>
</head>
4. 超链接事件
LINK 颜色的设置
基本格式：<bodylink=”颜色” alink=”颜色” vlink=”颜色”>
link 超链接尚被选中的文字
alink 超链接点选但未被放开的颜色
vlink 超链接已被点选过的颜色
5. 为链接创建键盘快捷键
accesskey="w" //windows:(Alt+w) mac:(Ctrl+w)
为链接设置tab符次序
tabindex="n"
表单
1. 表单的功能结构：
主标记结构：<form>…</form>
属性值 说明
name 字符串 给这个表单起个名字
method get/post 表单的传输方式
action url 传输目标
2. 文本栏、密码栏、隐藏栏
文本栏：<inputtype=”text” name=”栏位名称” value= ”栏位内定值” size=”栏位显示宽度” maxlength=”栏位数据输入最大长度” readonly=”readonly”>
密码栏：<inputtype=”password” name=”栏位名称” value=”栏位内定值” size=”栏位
显示宽度”maxlength=”栏位数据输入最大长度”readonly=”readonly”>
隐藏性栏位：<inputtype=”hidden” name=”栏位名称” value= ”栏位值”>
3. 复选栏、单选栏
多重勾选栏位：<input type=”checkbox” name=” 栏位名称” value=” 内定
值” checked=”checked” disabled=”disabled ”>
单选栏位:<inputtype=”radio” name=” 栏位名称” value=” 内定值”
checked=”checked” disabled=”disabled ”>
4. 窗体栏位、区块栏位
窗体选项栏位设置:<selectname=”栏位名称” size=”数字” >
<option value=”选项值” selected=”selected”>…
<option value=”选项值”>…
<option value=”选项值”>…
</select>
//分组<optgroup label="分组名称"></optgroup>
//多选multiple
文字区块的设置:<textareacols=”设置长度” rows=”设置宽度”>
………
</textarea>
5. 按钮、图像按钮
按钮设置:<input type=”submit” value=”按钮中显示的文字”>
<input type=”reset” value=”按钮中显示的文字”>
按钮图像:<buttonname=”栏位名称” type=”图象形态”>
<img src=”URL”>
</button>
图像按钮:<inputtype="image" src="url" alt="文本">
6. 允许上传文件
上传栏位:<inputtype="file" name="file">
7. 表单加上外框和标题
外边框:<fieldset>...</fieldset>
标题:<legend>...</legend>
框架
1. 多窗框的基本结构
格式：
<frameset>
<frame>
<frame>
<frame>
</frameset>
功能说明:<frameset>用来设置多窗框结构的声明
<frameset>下的属性：
属性名称 属性值 说明
cols 像素 设置直排的多窗框环境
百分比同上
rows 像素设 置横排的多窗框环境
百分比同上
border 像素 边框的宽度
framespacing 像素 页面与页面的边距
属性格式：
<frameset cols=”120,80,120”>
<frameset cols=”20%,40%,20%”>
<frameset cols=”40%,*,*”>
<frameset rows=”120,80,120”>
<frameset rows=”20%,40%,20%”>
<frameset rows=”20%,*,*”>
<frame>下的属性：
属性名称 属性值 说明
src URL 链接的页面
noresize true 允许浏览器自行改变框架大小
false 不允许
scrolling yes 不管网页内容的大小，都出现滚动条
no 不管网页内容的大小，都不现滚动条
auto 浏览器自动判断，是否需要滚动条
marginheight 像素 设置垂直方向，窗体内容与边界的距离
marginwidth 像素 设置水平方向，窗体内容与边界的距离
frameborder 0\1 不出现框体边/出现窗体边线
属性格式：
<frame src=”URL”>
<frame noresize>
2. 嵌套多窗体设置：
格式：
<frameset rows="20%,80%">
<framesrc="URL">
<framesetcols="20%,80%">
<frame src="URL">
<frame src="URL">
</frameset>
</frameset>
3. 多框架与超链接
框架式网站的好处就是在同一张页面可以显示多个页面，而且可以跟方便的进行链接。
相关属性说明：
<frame>的命名属性：
格式：<framename=”窗体名称”>
<a>超链接<a href=”URL” target=”窗体名称”>
多窗体链接的属性：
属性名称 属性值 说明
target _blank 打开一个新建的页面
4. 悬浮窗体的设置
格式:<iframe>…</iframe>
功能:设置悬浮窗框
属性名称属性值说明
height 像素/% 绝对/相对高度
width 像素/% 绝对/相对宽度
其余属性除了noresize外,其他都和frameset 一样.
多媒体
1. FLASH 动画的插入
使用<embed>...</embed>标记插入FLASH 动画
属性 值 说明
src urlflash 路径
width 像素/百分比 flash 宽度
height 像素/百分比 flash 高度
wmode window 使flash 自身的矩形窗口来播放
opaque 使flash 隐藏页面上位于它后面
transparent 使flash 某一部分透明
使用<object>...</object>标记插入flash 动画
属性值说明
type application/x-shockwave-flash flash 类型
data url flash 路径
width 像素/百分比flash 宽度
height 像素/百分比flash 高度
注意：必须再使用子标签<param>完成flash 插入
eg:
<objecttype="application/x-shockwave-flash" data="test.swf"width="400" height="600">
<paramname="movie" value="test.swf">
<paramname="wmode" value="transparent">
</object>
2. MP3 音频及WMV 视频的插入
使用<embed>...</embed>标记插入mp3
属性 值 说明
autostart true/false 自动/非自动播放
loop 数字 音乐循环的次数
背景音乐<bgsoundsrc=”URL” loop=”次数”>
使用<object>...</object>标记插入MP3 音乐
属性 值 说明
name src(路径) 音乐路径
autoplay (true/false) 是否自动播放