本文转载自:http://blog.csdn.net/iamduoluo/article/details/5875117
字体 | 标题字体 <Header> | <h>标题标签 |
<hn>标题标签 | ||
<font>标签 | 设置字体大小<size> | |
设置字体风格<face> | ||
常用文本格式Tag | 使用缩进<blockquote> | |
保留空格和换行<pre> | ||
使用内联行<span> | ||
使用文字方向<bdo> | ||
物理字体 | 设置粗体<b> | |
设置斜体<i> | ||
设置下划线<u>/<ins> | ||
设置中划线<del>/<s>/<strike> | ||
设置打印机效果<tt> | ||
设置上标<sup> | ||
设置下标<sub> | ||
逻辑字体 | 设置粗体<strong> | |
设置斜体<em> | ||
设置等宽字体<code> | ||
设置引用<samp> | ||
设置输入文本<kbd> | ||
设置变量<var> | ||
设置突出显示<dfn> | ||
设置内容出处<cite> | ||
设置小字体<small> | ||
设置大字体<big> | ||
显示特殊符号 | ||
显示< < | ||
显示> > | ||
显示" " | ||
显示& & |
超链接 | href属性 | 连接到同一页当前位置 | <a href="#name1">…</a> <a name="n">…</a> | |
制作本地链接 | 同级链接 | <a href="文件名">…</a> | ||
下级链接 | <a href="文件夹名/文件名">…</a> | |||
上级链接 | <a href="…/文件名">…</a> | |||
制作URL链接 | <a href="http://www.baidu.com/">链接到百度网站</a> | |||
制作目录链接 | 目录链接是指互相链接的网页在不同的文件夹里面 | |||
制作E-mail链接 | <a href="mailto:123@163.com">邮件连接</a> | |||
target属性 | 打开空白页_blank | <a href="http://www.baidu.com/" target="_blank">在空白页打开百度链接</a> | ||
打开上一级窗口_parent | <a href="http://www.baidu.com/" target="_parent">在上一级窗口打开链接</a> | |||
在本窗口打开_self | <a href="http://www.baidu.com/" target="_self">在本窗口打开链接</a> | |||
打开整个窗口_top | <a href="http://www.baidu.com/" target="_top">打开整个窗口</a> |
图像 | 网页图片概述 | ||
背景图像的设定 | <body background="#"></body> | ||
网页中插入图片标签 | 选择路径src | <img src="#" /> | |
设定替换文本alt | <img src="#" alt="" /> | ||
选择宽度width | <img src="#" width="" /> | ||
选择高度height | <img src="#" height="" /> | ||
设定低分辨率lowsrc | <img src="#" lowsrc="" /> | ||
设定映像地图usemap | |||
设定排列align | <img src="#" align="" /> | ||
设定边框border | <img src="#" border="n" /> | ||
设定水平间距hspace | <img src="#" hspace="n" /> | ||
设定垂直间距vlign | <img src="#" vspace="n" /> | ||
图像的超链接 | 链接本地图像 | <a href="#"><img src="n" /></a> | |
链接网上图像 | <a href="#" img src="URL"> | ||
链接本地页面 | |||
链接网上页面 | |||
编辑图像矩形热区 | <img src="#" usemap="#map" /> <map name="map"> <area shape="rect" coords="33, 36, 109, 94" href="#"> </map> | ||
编辑图像椭圆热区 | |||
编辑图像多边热区 | |||
插入图像占位符 | <img name="" src="" width="" height="" background-color="" /> | ||
用<img>标签插入avi文件 | 使用路径dynsrc | <img dynsrc="#" /> | |
循环播放次数loop | <img dynsrc="#" loop="n" /> | ||
播放方式start | <img dynsrc="#" start="n" /> |
表格 | 表格的基本结构 | <table> <tr> <td></td> </tr> </table> | |
表格<title> | 设置行标签<tr> | ||
设置表头单元格<th> | <table> <tr> <th></th> </tr> </table> | ||
设置单元格数据标签<td> | <table> <tr> <td></td> </tr> </table> | ||
<table>标签的属性 | 设置宽度width | <table width="n"> <tr> <td></td> </tr> </table> | |
设置高度height | |||
设置背景图片background | |||
设置间距cellspacing | |||
设置内容与边界的距离cellpadding | |||
边框 | <table border="n"> <tr> <td></td> </tr> </table> | ||
编辑边框颜色bordercolor | |||
编辑亮边框颜色bordercolorlight | |||
编辑暗边框颜色bordercolordark | |||
显示整个边框box | <table border="" frame="box"> | ||
不显示边框void | |||
显示上下边框hsides | |||
显示左右边框vsides | |||
显示上边框above | |||
显示下边框below | |||
显示左边框lhs | |||
显示右边框rhs | |||
表格行的设定 | 设置水平对齐align | <tr align=""> | |
设置垂直对齐valign | <tr valign=""> | ||
跨多行、多列的表元 | 设置跨多列colspan | <tr colspan="n"> | |
设置跨多行rowspan | <td rowspan="n"> | ||
表格行分组 | 使用表头标签<thead> | ||
使用主体标签<tbody> | |||
使用尾注标签<tfoot> | |||
表格的标题标签<caption> | <caption></caption> | ||
表格的嵌套 |
多媒体 | 滚动字幕<marquee> | 滚动字幕<marquee>标签概述 | <marquee>文本内容/链接图片</marquee> | |
设置移动方式behavior | 滚动播出 | <marquee behavior="scroll" width="300px" height="100px">滚动播出</marquee> | ||
滚动到一方后停止滚动 | <marquee behavior="slide" width="300px" height="100px">滚动播出</marquee> | |||
滚动到一方后向相反方向滚动 | <marquee behavior="alternate" width="300px" height="100px">滚动播出</marquee> | |||
设置背景颜色bgcolor | <marquee bgcolor="n">文本内容/链接图片</marquee> | |||
设置文字卷动方式direction | 从右到左滚动 | <marquee direction="left">文本内容/链接图片</marquee> | ||
从左到右滚动 | <marquee direction="right">文本内容/链接图片</marquee> | |||
从下到上滚动 | <marquee direction="up">文本内容/链接图片</marquee> | |||
从上到下滚动 | <marquee direction="down">文本内容/链接图片</marquee> | |||
设置移动速度scrollamount | <marquee scrollamount="n">文本内容/链接图片</marquee> | |||
设置停顿时间scrolldelay | <marquee scrolldelay="n">文本内容/链接图片</marquee> | |||
设置字幕左右空白区域hspace | <marquee hspace="n">文本内容/链接图片</marquee> | |||
设置字幕上下空白区域vspace | <marquee vspace="n">文本内容/链接图片</marquee> | |||
设置滚动次数loop | <marquee loop="n">文本内容/链接图片</marquee> | |||
设置鼠标滑过onMouseOver | <marquee onMouseOut="this.start()" onMouseOver="this.stop()">文本内容/链接图片</marquee> | |||
插入多媒体文件 | 插入音乐 | 设置音乐文件路径src | <embed src="#"></embed> | |
设置自动播放autostart | <embed src="#" autostart="true/false"></embed> | |||
设置播放次数loop | <embed src="#" loop="true/false"></embed> | |||
设置隐藏播放版面hidden | <embed src="#" hidden="true/false"></embed> | |||
插入Flash标签<object> | ||||
显示Flash标签<param> | ||||
插入Flash的另一标签<embed> | ||||
嵌入多媒体文件 | 设置背景音乐路径src | <bgsound src="#" /> | ||
设置自动播放autostart | <bgsound src="#" autostart="true/false" /> | |||
设置循环播放loop | <bgsound src="#" loop=n/indinite /> | |||
点播音乐 |
框架 | 框架含义 | ||
基本构成 | <frameset> <frame src="#" /> </frameset> | ||
框架集<frameset>控制 | 分割左右窗口cols | <frameset cols="*,*,*"> <frame src="#" /> </frame> | |
分隔上下窗口rows | <frameset rows="*,*.*"> <frame src="#" /> </frame> | ||
设置边框粗细border | <frameset border="n"> <frame src="#" /> </frameset> | ||
设置边框颜色bordercolor | <frameset border="n" bordercolor=""> <frame src="#" /> </frameset> | ||
是否显示边框frameborder | <frameset frameborder="1/0"> <frame src="#" /> </frameset> | ||
设置空白距离framespacing | <frameset frameborder="n"> <frame src="#" /> </frameset> | ||
添加<noframes>标签 | <frameset> <frame src="#" /> </frameset> <noframes> <body></body> </noframes> | ||
子框架<frame>标签的设定 | 设定调节noresize | <frameset> <frame src="#" /noresize="noresize" /> </frameset> | |
设定窗口嵌套 | <frameset> <frame src="#"> <frameset> <frame src="#"> <frame src="#"> </frameset> </frameset> | ||
窗口的名称和链接 | 框架集语法形式 | <frameset> <frame src="#" name="n"> </frameset> | |
链接页面语法形式 | <a href="#" target="n"></a> | ||
浮动窗口<iframe> | 设置滚动条scrolling属性 | <iframe src="#" scrolling="yes/no">代替文本内容</iframe> | |
设置透明浮动窗口allowtransparency属性 | <iframe src="#" allowtransparency="true">代替文本内容</iframe> | ||
浮动窗口链接 | 浮动窗口语法形式 | <iframe src="#" name="n">代替文本内容</iframe> | |
链接页面语法形式 | <a href="#" target="n"></a> |
列表 | 无序列表<ul> | 设置列表结构 | <ul> <li></li> </ul> | |
使用空心圆样式disc | <ul type="disc"> <li></li> </ul> | |||
使用空心圆样式circle | <ul type="circle"> <li></li> </ul> | |||
使用小方块样式square | <ul type="square"> <li></li> </ul> | |||
有序列表<ol> | 设置列表结构 | <ol> <li></li> </ol> | ||
使用数字标号样式 | <ol type="1"> <li></li> </ol> | |||
使用大写字母标号样式 | <ol type="A"> <li></li> </ol> | |||
使用小写字母标号样式 | <ol type="a"> <li></li> </ol> | |||
使用大写罗马数字标号样式 | <ol type="Ⅰ"> <li></li> </ol> | |||
使用小写罗马数字标号样式 | <ol type="i"> <li></li> </ol> | |||
嵌套列表 | 嵌套无序列表 | <ul> <li> <ul> <li></li> </ul> </li> </ul> | <ol> <li> <ul> <li></li> </ul> </li> </ol> | |
嵌套有序列表 | <ul> <li> <ol> <li></li> </ol> </li> </ul> | <ol> <li> <ol> <li></li> </ol> </li> </ol> | ||
自定义列表的标记 | 显示整体列表<dl> | <dl> <dt></dt> </dl> | ||
设置列表项标签<dt> | <dl> <dt></dt> <dt></dt> </dl> | |||
设置注释项标签<dd> | <dl> <dt></dt> <dd></dd> </dl> | |||
目录列表<dir> | <dir> <li></li> </dir> | |||
菜单列表<menu> | <menu> <li></li> </menu> |
表单 | 基本语法 | 设置链接跳转action | <form action=""></form> | |
指向链接跳转方法method | <form action="" method="get/post"></form> | |||
设置链接跳转方式target | <form action="" target="_blank/_parent/_self/_top"></form> | |||
设置字符集列表accept-charset | <form accpet-charset=""></form> | |||
设置编码表单内容enctype | <form enctype=""></form> | |||
定义表单名称name | <form name=""><form> | |||
输入框 | <form> <imput /> </form> | 输入文字 | <form> <input type="text" name="n" id="" /> </form> | |
输入密码 | <form> <input type="password" name="n" id="" /> </form> | |||
使用单选框 | <form> <input type="radio" name="n" id="" value="" /> </form> | |||
使用复选框 | <form> <input type="checkbox" name="n" id="" value="" /> </form> | |||
使用图像域 | <form> <input type="image" name="n" id="" src="#" /> </form> | |||
使用隐藏表单的元素 | <form> <input type="hidden" name="n" value="#" /> </form> | |||
使用列表框 | <form> <select name="n" id=""> <option value=" "></option> </select> </form> | |||
使用文本区域 | <form> <textarea name="n" id=""cols=""></textarea> </form> | |||
使用按钮 | 设置提交按钮 | <form> <input type="submit" name="n" id="" value="" /> </form> | ||
设置清空按钮 | <form> <input type="reset" name="n" id="" value="" /> </form> |
布局 | 使用表格 | |||
使用div | 在内容中应用div | <div style=""></div> | ||
嵌套div | <div> <div> 被嵌套的文本内容 </div> </div> | |||
使用浮动样式定义框架 | <div style="float:left/none/right;"></div> | |||
制作左右结构的框架 | <div> <div style="float:left;"></div> <div style="float:right;"></div> </div> | |||
制作横向结构的框架 | 横向结构的框架是指水平线上分隔出来的框架。它和左右结构的框架有些相似,都利用同样的原理设计,只是多了几个小的div标签。语法形式和左右框架的语法形式一样。 | |||
制作纵向结构的框架 | 纵向结构的框架是指垂直线上分割出来的框架。它和横向结构的框架有些相似,只是多了一个clear属性,使框架纵向排列 | <div> <div style="clear:both;"></div> <div style="clear:both;"></div> </div> |