HTML全集

本文转载自：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>
显示特殊符号 　
显示&lt; < 　
显示&gt; > 　
显示&quot; " 　
显示&amp; & 　

 

 

 

超链接 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>

 

posted @ 2014-11-19 18:05  清晨_  阅读(198)  评论(0)    收藏  举报