HTML：基础标签及属性（备份）
2014-08-18 10:06
274 查看
基 本 标 签
创建一个HTML文档 <html></html>设置文档标题以及其他不在WEB网页上显示的信息 <head></head>
设置文档的可见部分 <body></body>
标 题 标 签
将文档的题目放在标题栏中 <title></title>
文 档 整 体 属 性
设置背景颜色，使用名字或十六进制值 <body bgcolor=?>
设置文本文字颜色，使用名字或十六进制值 <body text=?>
设置链接颜色，使用名字或十六进制值 <body link=?>
设置已使用的链接的颜色，使用名字或十六进制值 <body vlink=?>
设置正在被击中的链接的颜色，使用名字或十六进制值 <body alink=?>
文 本 标 签
创建预格式化文本 <pre></pre>
创建最大的标题 <h1></h1>
创建最小的标题 <h6></h6>
创建黑体字 <b></b>
创建斜体字 <i></i>
创建打字机风格的字体 <tt></tt>
创建一个引用，通常是斜体 <cite></cite>
加重一个单词（通常是斜体加黑体） <em></em>
加重一个单词（通常是斜体加黑体） <strong></strong>
设置字体大小，从1到7 <font size=?></font>
设置字体的颜色，使用名字或十六进制值 <font color=?></font>
链 接
创建一个超链接 <a href="URL"></a>
创建一个自动发送电子邮件的链接 <a href="mailto:EMAIL">.... </a>
创建一个位于文档内部的靶位 <a name="NAME"></a>
创建一个指向位于文档内部靶位的链接 <a href="#NAME"></a>
格 式 排 版
创建一个新的段落 <p>
将段落按左、中、右对齐 <p align=?>
插入一个回车换行符 <br>
从两边缩进文本 <blockquote>
</blockquote>
创建一个定义列表 <dl></dl>
放在每个定义术语词之前 <dt>
放在每个定义之前 <dd>
创建一个标有数字的列表 <ol></ol>
放在每个数字列表项之前，并加上一个数字 <li>
创建一个标有圆点的列表 <ul></ul>
放在每个圆点列表项之前，并加上一个圆点 <li>
一个用来排版大块HTML段落的标签，也用于格式化表 <div align=?>
图 形 元 素
添加一个图像 <img src="name">
排列对齐一个图像：左中右或上中下 <img src="name" align=?>
设置围绕一个图像的边框的大小 <img src="name" border=?>
加入一条水平线 <hr>
设置水平线的大小（高度） <hr size=?>
设置水平线的宽度（百分比或绝对像素点） <hr width=?>
创建一个没有阴影的水平线 <hr noshade>
表 格
创建一个表格 <table></table>
开始表格中的每一行 <tr></tr>
开始一行中的每一个格子 <td></td>
设置表格头：一个通常使用黑体居中文字的格子 <th></th>
表 格 属 性
设置围绕表格的边框的宽度 <table border=#>
设置表格格子之间空间的大小 <table cellspacing=#>
设置表格格子边框与其内部内容之间空间的大小 <table cellpadding=#>
设置表格的宽度－用绝对像素值或文档总宽度的百分比 <table width=# or %>
设置表格格子的水平对齐（左中右） <tr align=?> or <td align=?>
设置表格格子的垂直对齐（上中下） <tr valign=?> or <td valign=?>
设置一个表格格子应跨占的列数（缺省为1） <td colspan=#>
设置一个表格格子应跨占的行数（缺省为1） <td rowspan=#>
禁止表格格子内的内容自动断行回卷 <td nowrap>
窗 框
放在一个窗框文档的<body>标签之前，也可以嵌在其他窗框文档中 <frameset></frameset>
定义一个窗框内的行数，可以使用绝对像素值或高度的百分比 <frameset rows="value,value">
定义一个窗框内的列数，可以使用绝对像素值或宽度的百分比 <frameset cols="value,value">
定义一个窗框内的单一窗或窗区域 <frame>
定义在不支持窗框的浏览器中显示什么提示 <noframes></noframes>
窗 框 属 性
规定窗框内显示什么HTML文档 <frame src="URL">
命名窗框或区域以便别的窗框可以指向它 <frame name="name">
定义窗框左右边缘的空白大小，必须大于等于1 <frame marginwidth=#>
定义窗框上下边缘的空白大小，必须大于等于1 <frame marginheight=#>
设置窗框是否有滚动栏，其值可以是"yes","no","auto"，缺省时一般为"auto" <frame scrolling=VALUE>
禁止用户调整一个窗框的大小 <frame noresize>
表 单
对于功能性的表单，一般需要运行一个CGI小程序，HTML仅仅是产生表单的表面样子。
创建所有表单 <form></form>
创建一个滚动菜单，size设置在需要滚动前可以看到的表单项数目 <select multiple name="NAME" size=?></select>
设置每个表单项的内容 <option>
创建一个下拉菜单 <select name="NAME"></select>
设置每个菜单项的内容 <option>
创建一个文本框区域，列的数目设置宽度，行的数目设置高度 <textarea name="NAME" cols=40 rows=8></textarea>
创建一个复选框，文字在标签后面 <input type="checkbox" name="NAME">
创建一个单选框，文字在标签后面 <input type="radio" name="NAME" value="x">
创建一个单行文本输入区域，size设置以字符计的宽度 <input type=text name="foo" size=20>
创建一个submit（提交）按钮 <input type="submit" value="NAME">
创建一个使用图象的submit（提交）按钮 <input type="image" border=0 name="NAME" src="name.gif">
创建一个reset（重置）按钮 <input type="reset">
跑马灯
<marquee>...</marquee>普通卷动<marquee behavior=slide>...</marquee>滑动
<marquee behavior=scroll>...</marquee>预设卷动
<marquee behavior=alternate>...</marquee>来回卷动
<marquee direction=down>...</marquee>向下卷动
<marquee direction=up>...</marquee>向上卷动
<marquee direction=right></marquee>向右卷动
<marquee direction=left></marquee>向左卷动
<marquee loop=2>...</marquee>卷动次数
<marquee width=180>...</marquee>设定宽度
<marquee height=30>...</marquee>设定高度
<marquee bgcolor=FF0000>...</marquee>设定背景颜色
<marquee scrollamount=30>...</marquee>设定卷动距离
<marquee scrolldelay=300>...</marquee>设定卷动时间
<!>字体效果
<h1>...</h1>标题字(最大)
<h6>...</h6>标题字(最小)
<b>...</b>粗体字
<strong>...</strong>粗体字(强调)
<i>...</i>斜体字
<em>...</em>斜体字(强调)
<dfn>...</dfn>斜体字(表示定义)
<u>...</u>底线
<ins>...</ins>底线(表示插入文字)
<strike>...</strike>横线
<s>...</s>删除线
<del>...</del>删除线(表示删除)
<kbd>...</kbd>键盘文字
<tt>...</tt> 打字体
<xmp>...</xmp>固定宽度字体(在文件中空白、换行、定位功能有效)
<plaintext>...</plaintext>固定宽度字体(不执行标记符号)
<listing>...</listing> 固定宽度小字体
<font color=00ff00>...</font>字体颜色
<font size=1>...</font>最小字体
<font style =font-size:100 px>...</font>无限增大
<!>区断标记
<hr>水平线
<hr size=9>水平线(设定大小)
<hr width=80%>水平线(设定宽度)
<hr color=ff0000>水平线(设定颜色)
<br>(换行)
<nobr>...</nobr>水域(不换行)
<p>...</p>水域(段落)
<center>...</center>置中
<!>连结格式
<base href=地址>(预设好连结路径)
<a href=地址></a>外部连结
<a href=地址 target=_blank></a>外部连结(另开新窗口)
<a href=地址 target=_top></a>外部连结(全窗口连结)
<a href=地址 target=页框名></a>外部连结(在指定页框连结)
<!>贴图/音乐
<img src=图片地址>贴图
<img src=图片地址 width=180>设定图片宽度
<img src=图片地址 height=30>设定图片高度
<img src=图片地址 alt=提示文字>设定图片提示文字
<img src=图片地址 border=1>设定图片边框
<bgsound src=MID音乐文件地址>背景音乐设定
<!>表格语法
<table align=left>...</table>表格位置,置左
<table aling=center>...</table>表格位置,置中
<table background=图片路径>...</table>背景图片的URL=就是路径网址
<table border=边框大小>...</table>设定表格边框大小(使用数字)
<table bgcolor=颜色码>...</table>设定表格的背景颜色
<table bordercolor=颜色码>...</table>设定表格边框的颜色
<table bordercolordark=颜色码>...</table>设定表格暗边框的颜色
<table bordercolorlight=颜色码>...</table>设定表格亮边框的颜色
<table cellpadding=参数>...</table>指定内容与网格线之间的间距(使用数字)
<table cellspacing=参数>...</table>指定网格线与网格线之间的距离(使用数字)
<table cols=参数>...</table>指定表格的栏数
<table frame=参数>...</table>设定表格外框线的显示方式
<table width=宽度>...</table>指定表格的宽度大小(使用数字)
<table height=高度>...</table>指定表格的高度大小(使用数字)
<td colspan=参数>...</td>指定储存格合并栏的栏数(使用数字)
<td rowspan=参数>...</td>指定储存格合并列的列数(使用数字)
<!>分割窗口
<frameset cols="20%,*">左右分割,将左边框架分割大小为20%右边框架的大小浏览器会自动调整
<frameset rows="20%,*">上下分割,将上面框架分割大小为20%下面框架的大小浏览器会自动调整
<frameset cols="20%,*">分割左右两个框架
<frameset cols="20%,*,20%">分割左中右三个框架
<分割上下两个框架
<frameset rows="20%,*,20%">分割上中下三个框架
<A HREF TARGET> 指定超级链接的分割窗口
<A HREF=#锚的名称> 指定锚名称的超级链接
<A HREF> 指定超级链接
<A NAME=锚的名称> 被连结点的名称
<ADDRESS>....</ADDRESS> 用来显示电子邮箱地址
<B> 粗体字
<BASE TARGET> 指定超级链接的分割窗口
<BASEFONT SIZE> 更改预设字形大小
<BGSOUND SRC> 加入背景音乐
<BIG> 显示大字体
<BLINK> 闪烁的文字
<BODY TEXT LINK VLINK> 设定文字颜色
<BODY> 显示本文
<BR> 换行
<CAPTION ALIGN> 设定表格标题位置
<CAPTION>...</CAPTION> 为表格加上标题
<CENTER> 向中对齐
<CITE>...<CITE> 用于引经据典的文字
<CODE>...</CODE> 用于列出一段程序代码
<COMMENT>...</COMMENT> 加上批注
<DD> 设定定义列表的项目解说
<DFN>...</DFN> 显示"定义"文字
<DIR>...</DIR> 列表文字卷标
<DL>...</DL> 设定定义列表的卷标
<DT> 设定定义列表的项目
<EM> 强调之用
<FONT FACE> 任意指定所用的字形
<FONT SIZE> 设定字体大小
<FORM ACTION> 设定户动式窗体的处理方式
<FORM METHOD> 设定户动式窗体之资料传送方式
<FRAME MARGINHEIGHT> 设定窗口的上下边界
<FRAME MARGINWIDTH> 设定窗口的左右边界
<FRAME NAME> 为分割窗口命名
<FRAME NORESIZE> 锁住分割窗口的大小
<FRAME SCROLLING> 设定分割窗口的滚动条
<FRAME SRC> 将HTML文件加入窗口
<FRAMESET COLS> 将窗口分割成左右的子窗口
<FRAMESET ROWS> 将窗口分割成上下的子窗口
<FRAMESET>...</FRAMESET> 划分分割窗口
<H1>~<H6> 设定文字大小
<HEAD> 标示文件信息
<HR> 加上分网格线
<HTML> 文件的开始与结束
<I> 斜体字
<IMG ALIGN> 调整图形影像的位置
<IMG ALT> 为你的图形影像加注
<IMG DYNSRC LOOP> 加入影片
<IMG HEIGHT WIDTH> 插入图片并预设图形大小
<IMG HSPACE> 插入图片并预设图形的左右边界
<IMG LOWSRC> 预载图片功能
<IMG SRC BORDER> 设定图片边界
<IMG SRC> 插入图片
<IMG VSPACE> 插入图片并预设图形的上下边界
<INPUT TYPE NAME value> 在窗体中加入输入字段
<ISINDEX> 定义查询用窗体
<KBD>...</KBD> 表示使用者输入文字
<LI TYPE>...</LI> 列表的项目 ( 可指定符号 )
<MARQUEE> 跑马灯效果
<MENU>...</MENU> 条列文字卷标
<META NAME="REFRESH" CONTENT URL> 自动更新文件内容
<MULTIPLE> 可同时选择多项的列表栏
<NOFRAME> 定义不出现分割窗口的文字
<OL>...</OL> 有序号的列表
<OPTION> 定义窗体中列表栏的项目
<P ALIGN> 设定对齐方向
<P> 分段
<PERSON>...</PERSON> 显示人名
<PRE> 使用原有排列
<SAMP>...</SAMP> 用于引用字
<SELECT>...</SELECT> 在窗体中定义列表栏
<SMALL> 显示小字体
<STRIKE> 文字加横线
<STRONG> 用于加强语气
<SUB> 下标字
<SUP> 上标字
<TABLE BORDER=n> 调整表格的宽线高度
<TABLE CELLPADDING> 调整数据域位之边界
<TABLE CELLSPACING> 调整表格线的宽度
<TABLE HEIGHT> 调整表格的高度
<TABLE WIDTH> 调整表格的宽度
<TABLE>...</TABLE> 产生表格的卷标
<TD ALIGN> 调整表格字段之左右对齐
<TD BGCOLOR> 设定表格字段之背景颜色
<TD COLSPAN ROWSPAN> 表格字段的合并
<TD NOWRAP> 设定表格字段不换行
<TD VALIGN> 调整表格字段之上下对齐
<TD WIDTH> 调整表格字段宽度
<TD>...</TD> 定义表格的数据域位
<TEXTAREA NAME ROWS COLS> 窗体中加入多少列的文字输入栏
<TEXTAREA WRAP> 决定文字输入栏是自动否换行
<TH>...</TH> 定义表格的标头字段
<TITLE> 文件标题
<TR>...</TR> 定义表格美一行
<TT> 打字机字体
<U> 文字加底线
<UL TYPE>...</UL> 无序号的列表 ( 可指定符号 )
<VAR>...</VAR> 用于显示变量
HTML标签和属性的语义化
分离结构与表现的另一个重要方面是使用语义化的标记来构造文档内容。一个 XHTML 元素的存在就意味被标记内容的那部分有相应的结构化的意义，没有理由使用其他的标记。换句话说，不要让 CSS 使一个 HTML 元素看起来就像另一个 HTML 元素，比如用<div>来代替<p>标记标题。首先是关于语义（Semantics）和默认样式的区别，默认样式是浏览器设定的一些常用tag的表现形式，个人认为他的主要目的就是让大家直观的认识标签(markup)和属性(attribute)的用途和作用，很明显Hx系列看起来很像标题，因为拥有粗体和较大的字号。<strong>,<em>用来区别于其他文字，起到了强调的作用。至于列表和表格很明显的告诉你他们是做什么的。
其次，语义化的网页的好处，最主要的就是对搜索引擎友好，又了良好的结构和语义你的网页内容自然容易被搜索引擎抓取，你网站的推广便可以省下不少的功夫。
具体的语义和用途在，XHTML1.0 TAG 参考中都已经说明，这里将一些容易遗忘或者混淆的TAGS和属性予以补充。
<Hx>
<h1>、<h2>、<h3>、<h4>、<h5>、<h6>,作为标题使用，并且依据重要性递减。<h1>是最高的等级。
例如:
<h1>文档标题</h1>
<h2>次级标题</h2>
而不要使用
<div class=\"title\">文档标题</div>，或者<span class=\"title\">文档标题</span>.很明显搜索引擎对于后者是不会认为他是标题的。
<p>
段落标记，知道了<p>作为段落，你就不会再使用<br/>来换行了，而且不需要<br/><br/>来区分段落与段落。<p></p>中的文字会自动换行，而且换行的效果优于<br>。段落与段落之间的空隙也可以利用CSS来控制，很容易而且清晰的区分出段落与段落。在利用行高(line-height)很容易的定义出行间距，再定义首字下沉等效果，那就挺完美了。
例如：
<p>在利用行高(line-height)很容易的定义出行间距，再定义首字下沉等效果，那就挺完美了。</p>
<ul>、<ol>、<li>
<ul>无序列表，很常见的到了大家广泛的使用，<ol>有序列表也挺常用。在web标准化过程中，<ul>还被更多的用于导航条，本来导航条就是个列表，这样做是完全正确的，而且当你的浏览器不支持CSS的时候，导航链接仍然很好使，就是美观方面差了一点。
例如:
<span style="font-size:18px;"> <ul> <li>项目一</li> <li>项目二</li> <li>项目三</li> </ul> <ol> <li>第一章</li> <li>第二章</li> <li>第三章</li> </ol> <dl>、<dt>、<dd> dl就是“定义列表”。比如说词典里面的词的解释、定义就可以用这种列表。 例如： <dl> <dt>Dog</dt> <dd>A carnivorous mammal of the family Canidae.</dd> </dl> <dl> <dt>上海滩</dt> <dd>这部拍摄于1980年的《上海滩》堪称是香港电视史上最成功、最经典的剧集。 当年在香港播出以后，产生了巨大的轰动效应。</dd> <dt>周润发</dt> <dd>和所有伟大的影星一样，周润发印证了一个时代，一个香港电影的黄金时代。 风衣墨镜、冷血双枪、阳光微笑，都封存胶片之中，当我们回首寻望的时候，发哥已被刻为一个时代的坐标。</dd> </dl></span>
<cite>、cite 、<q>、 <blockquote>
论坛和blog经常会用到引用别人的话，用<q>来标记简短的单行引用。Web浏览器会自动识别在<q> 之间的内容。不幸的是，IE不能识别，并且有些时候， <q>会引起一些可访问性(Accessibility)的问题。正因为如此，一些人建议尽量不要使用 <q>,手动的插入引用标记。在一个包含适当的类的 <span>中加入单行的引用内容，那么就可以用CSS来给引用设计样式了，但是这个没有语义上的意义。CSS可以用来定义引用的样式。注意，一段文章是不可以直接放在<blockquote>中的，引用的内容还必须包含在一个元素中，通常是<p>。属性cite既可以与<q>
一起用，也可以与<blockquote>一起用，用来提供引用内容的来源地址。需要注意的是，如果你使用 <span>来代替 <q>标记引用内容,那么你就不能使用 cite属性了。
例如:
<cite>Designing with Web Standards</cite> is an excellent book by Jeffrey Zeldman.
<p> <cite>孔子</cite>曰：<q>学而不思则罔，思而不学则殆</q>.</p>
<p>The W3C says that <q cite=\"http://www.w3.org/TR/REC-html40/
struct/text.html#h-9.2.1\">The presentation of phrase elements
depends on the user agent.</q>.</p>
<blockquote cite=\"http://www.w3cn.org/\">
<p>“我们大部分人都有深刻体验，每当主流浏览器版本的升级，我们刚建立的网站就可能变得过时，
我们就需要升级或者重新建造一遍网站。例如1996-1999年典型的\"浏览器大战\"，
为了兼容 Netscape 和 IE，网站不得不为这两种浏览器写不同的代码。同样的，
每当新的网络技术和交互设备的出现，我们也需要制作一个新版本来支持这种新技术或新设备，
例如支持手机上网的 WAP 技术。类似的问题举不胜举：网站代码臃肿、繁杂浪费了我们大量的带宽；
针对某种浏览器的 DHTML 特效，屏蔽了部分潜在的客户；不易用的代码，残障人士无法浏览网站等等。
这是一种恶性循环，是一种巨大的浪费。”</p>
</blockquote>
<em>、 <strong>
<em> 是用作强调的，<strong>是用作重点强调的。 大部分浏览器用斜体显示强调的内容，用粗体来显示重点强调的内容，然而，这是没有必要的，如果是为了确定强调内容的显示方式，最好的方法就是使用CSS来定义他们的表现。当你想要的只是视觉上的效果时，就不要使用强调了。而且如果你想要强调但是还觉得粗体或者斜体不视觉效果没那么好，特别是斜体对于中文来说，那么你完全可以定义一些其他的比较醒目的样式达到强调的效果。
例如:
<p><em>强调</em> 的文本通常用斜体显示，
然而， <strong>特别强调</strong> 的文本通常以粗体显示。</p>
<table>、<td>、<th>、< caption >、 summary
XHTML中的表格不应用来布局。然而如果是为了标记列表的数据，就应该使用表格了。<th>为表格标题，属性summar为摘要，<caption>标签为首部说明，<thead>标签为表格头部，<tbody>标签为表格主体内容，<tfoot>标签为表格尾部。
其中还可以使用scope 可用于取代headers属性，标记含有表头信息的单元格，其中各数值的内容如下：
row 指示当前单元格，为包含当前单元格的行提供相关的表头信息。
col 指示当前单元格，为根据当前单元格指定的列提供相应的表头信息。
rowgroup 指示当前单元格，为包含当前单元格的其余行组提供相关的表头信息。
colgroup 指示当前单元格，为根据当前单元格指定的其余列组提供相应的表头信息。
abbr 用于定义表头单元格中的缩写名，如果没有定义该属性，则将默认单元格内容为节略形式。
例如:
<span style="font-size:18px;"> <table id=\"mytable\" cellspacing=\"0\" summary=\"The technical specifications of the Apple PowerMac G5 series\"> <caption>Table 1: Power Mac G5 tech specs </caption> <tr> <th scope=\"col\" abbr=\"Configurations\" class=\"nobg\">Configurations</th> <th scope=\"col\" abbr=\"Dual 1.8\">Dual 1.8GHz</th> <th scope=\"col\" abbr=\"Dual 2\">Dual 2GHz</th> <th scope=\"col\" abbr=\"Dual 2.5\">Dual 2.5GHz</th> </tr> <tr> <th scope=\"row\" abbr=\"Model\" class=\"spec\">Model</th> <td>M9454LL/A</td> <td>M9455LL/A</td> <td>M9457LL/A</td> </tr> <tr> <th scope=\"row\" abbr=\"G5 Processor\" class=\"specalt\">G5 Processor</th> <td class=\"alt\">Dual 1.8GHz PowerPC G5</td> <td class=\"alt\">Dual 2GHz PowerPC G5</td> <td class=\"alt\">Dual 2.5GHz PowerPC G5</td> </tr> <tr> <th scope=\"row\" abbr=\"Frontside bus\" class=\"spec\">Frontside bus</th> <td>900MHz per processor</td> <td>1GHz per processor</td> <td>1.25GHz per processor</td> </tr> <tr> <th scope=\"row\" abbr=\"L2 Cache\" class=\"specalt\">Level2 Cache</th> <td class=\"alt\">512K per processor</td> <td class=\"alt\">512K per processor</td> <td class=\"alt\">512K per processor</td> </tr> </table> <dfn> <p><dfn title=\"Microsoft web browser\">Internet Explorer</dfn> is the most popular browser used underwater.</p> <ins>, <del> 知道del，就不要再用<s>做删除线了，用del显然更具有语义化。而且del还带有cite和datetime来表明删除的原因以及删除的时间。ins是表示插入，也有这样的属性。 例如： <p>It really was <ins cite=\"rarara.html\" datetime=\"20031024\">very</ins> good.</p> <code></span>
表示是计算机代码。而默认样式为打字体。技术论坛和blog中经常遇到。
例如：
<code>p{margin:2px 0;}</code>
<abbr>、<acronym>
<abbr>标签是表示web页面上的简称，<acronym>标签为取首字母缩写。（注：这里把简称和缩写分开而论，简称范围比缩写大，取首字母的缩写用<acronym>标签）Windows的IE6.0以下的浏览器暂不支持<abbr>标签。 在IE里，你可以应用CSS给<acronym>但是不能应用给<abbr>标签，IE会为<acronym>标签的title属性显示提示，但是会忽略<abbr>标签。
例如:
<abbr title=\"Cascading Style Sheets\">CSS</abbr>
<acronym title=\"Cascading Style Sheets\">CSS</acronym>
alt属性和title属性
title属性用来为元素提供额外说明信息title属性可以用在除了base，basefont，head，html，meta，param，script和title之外的所有标签。但是并不是必须的。
alt属性为不能显示图像、窗体或applets的用户代理（UA），指定替换文字。替换文字的语言由lang属性指定。
<img src=\"/images/logo.gif\" width=\"90\" height=\"27\" alt=\"webjx.com\"/>
<a href=\"http://www.baidu.com\" title=\"用Photoshop创建最佳黑白照片的方法\">用Photoshop创建最佳黑白照片的方法</a>
HTML语言的简要注释
<html> </html>标志着html文件的开始与结束<head> </head>头部标志符
<title> </title>网页的标题
<boby> </boby>构成web的主体
1.background 定义网页的背景图案
2.bgcolor 背景色（默认 白）
3.text 文字颜色（默认 黑）
4.link 超链接颜色（默认 蓝）
5.alink 当前被选中的超链接颜色（默认 红）
6.vlink 已被访问过的超链接颜色（默认 紫）
<font> </font>标志符可以控制字符的样式
1.face 设置文字的字体效果
2.color 设置文字颜色
3.size 设置字体大小
<b></b> 粗体
<strike></strike>删除线
<big></big>大字体
<sub></sub>下标
<i></i>斜体
<sup></sup>上标
<s></s>删除线
<u></u>下划线
<small></small>小字体
<hn></hn>设置文件中的标题 nj 1~6的数字
<p></p>(paragraph)划分段落
<pre></pre>预格式化标志符
<hr> 换行并绘制一条水平线（没有结束标志符）
1.width 水平线长度
2.size 水平线粗细
3.noshade 无阴影
4.align 水平线的对齐方式（left center right)
5.color 水平线颜色
<br> 强制换行(没有结束标志符)
<ol>
<li>......</li>
<li>......</li>
.......
</ol> 设置有序列表 li可是1.2.3....或a.b.c....或A.B.C...或i.ii.iii.....或I.II.III....
(两个属性:type start)
<ul>
<li>......</li>
<li>......</li>
......
</ul> 无序列表 (一个属性:type disc实心圆 circle空心圆 square方框)
<a></a>实现超链接
1.href 定义超链接所指向的文档的URL
2.target 目标窗口
3.name 锚名称 （该属性一般在创建页面内超链接时使用)
<a href="/URL"></a>使用a标志符创建超链接时，可以使用相对路径（同一网站内的文件），也可以使用绝对路径（指向本站点以外的文件)
<a > </a>
.....
<a href="#锚点名称"></a>创建网面内超链接逻辑上分为两步，首先定义锚点，然后再创建指向锚点的超链接
<a href="mailto:电子邮箱地址"></a>指向电子邮箱的超链接>
<img> 插入图像
1.src 设置被引用的图像文件所在的位置2.alt 设置图像的简单文字说明
3.width,height 设置图像的宽度与高度
4.align 对齐方式(left,right,top,bottom,middle)
5.border 边框宽度
6.hspace ,vspace 定义了图像与周围元素的水平和垂直间距
<map >
<area>
</area>
......
</map>
<img src="/"usemap="#图像映射名称"><map></map>定义了图像映射的区域
img通过usemap可以确定与所建立的图像映射区域的关系
area定义图像不同区域与不同文档之间建立链接
1.shape 形状(rect矩形 circle圆 poly多边形)
2.coords 坐标
3.target 目标窗口
4.alt 替换文字
<table>
<caption> </caption>
<tr>
<th> </th><th> </th>......
</tr>
<tr>
<td> </td><td> </td>......
</tr>
<tr>
<td> </td><td> </td>
</tr>
......
</table> table标记符定义表格 caption定义表格标题 tr标记符定义表格的行 th,td标志符定义表格的单元格 th定义表头单元格
table可以创建一个新的表格
1.width(宽),height(高)2.border(边框)
3.bgcolor(背景颜色)
4.align(对齐方式left right center)
5.cellpadding(填充距)
6.cellspacing(单元格间距)
7.rules(分隔线 none无分隔线 groups在行列之间有 rows只有行分隔线 cols只有列 all所有)
8.frame(边框 void无边框 above只显示顶部边框 below只显示底部边框 hsides只显示顶，底部边框 vsides只显示左右边框 lhs显示左边框 rhs显示右 box显示所有)
<tr> </tr>表行
1.align 对齐方式(left center right)
2.valign 垂直对齐方式 (top middle bottom baseline)
3.bgcolor 背景颜色
<td></td>表格数据
1.width,height
2.align(left right center)
3.valign(top middle bottom)
4.bgcolor
5.rowspan 单元表的行数
6.colspan 单元表的列数
<frameset>
<frame>
......
<frame>
</frameset>
frameset是将窗口分割成若干个子窗口，子窗口数取决于frame的个数
<frame> 标记符来标识子窗口(无结果符)
1.name
2.src(源) 设置框架内容的URL
3.frameborder(框架边框)
4.marginwidth (框架的左右边距)
5.marginheight(框架的上下边距)
6.scrolling(是否显示滚动条 auto自动 yes显示 no不显示)
7.noresize(不允许调整框架的尺寸)
<a herf="目标文件"target="目标框架名">超链接内容</a>
1._top 表示将超链接的目标文件装入整个浏览器窗口
2._self 表示将超链接的目标文件装入当前框架，以取代该框架中正在显示的文件
3._blank 表示将超链接的目标文件装入一个新的浏览窗口
4._parent 表示将超链接的目标文件装入当前框架的父框架
<iframe></iframe>定义了一个页面内的框架
1.src(源) 设置框架内容的URL
2.name
3.width,height
4.align (top middle bottom)
5.frameborder(框架边框)
6.marginwidth(框架左右边框),marginheight(框架上下边框)
7.scrolling(是否显示滚动条 auto yes no)
<form></form>表单
1.method(方法) 定义表单的提交方式2.action(动作) 指定表单所对应的处理程序
<input> 定义了一个用于用户输入的表单元素(无结束标记符)
1.name 标识表单元素2.type 指定表单元素的类型(text文本 password密码 checkbox复选框 radio单选框 submit提交按钮 reset重置按钮)
<input type="text">将type指定为text,在浏览器中显示一个文本输入框，供用户输入信息
1.value (初始值)
2.size (尺寸)
3.maxlength(输入文本的最大字符数)
<input type="password">密码文本框
例:<form>密码:<input type="password"size="10"maxlength="15"></form>
<input type="checkbox">复选框
例:<from><p>你的爱好:</P><input type="checkbox"value="music"checked>音乐<input type="checkbox"value="sports">体育<input type="checkbox"value="other">其它</form>
<input type="radio">单选框
例:<form><p>公司的人数:</p><p><input type="radio">少于10人</p><p><input type="radio"checked>10人至100人</p><p><input type="radio">100人以上</p></form>
<input type="submit">提交按钮
<form>
<input type="submit"value="提交">
</form>
<input type="reset">重置按钮
<input type="image">图像提交按钮
<input type="file">
<input type="buttom">
<input type="hidden">
<textarea> </textarea>定义一个用于用户多行输入的表单元素
1.name 指定文本域的名称
2.rows 指定文本域的高度
3.cols 指定文本域的宽度
<select>
<option></option>
<option></option>
......
<option></option>
</select> 定义了一个选项列表表单元素
1.name 指定选取项列表的名称2.size 指定列表选项显示时一次显示选项的数目
3.multiple使用该属性可以允许多重选择
4.value 指定当该选项被选中并提交后，浏览器传给服务器的数据
5.selected 指定哪一个选项在默认状态下是选中状态
<label></label>选中该控件
<marquee></marquee>创建一些滚动字幕
1.direction(方向 left right up down)
2.behavior (行为 scroll绕圈滚动 slide只滚一次 alternate来回滚动)
3.loop (循环)
4.scrollamount(滚动的速度)
5.scrolldelay(滚动延时)
6.align(对齐方式 top middle bottom)
7.bgcolor
8.height,width
9.hspace,vspace(垂直和水平间距)
<applet>
<param></param>
......
</applet>
applet用来在网页中插入一个Java小应用程序对象
1.code(源代码) 指定Java小应用程序的源代码文件(.class文件)
2.name
3.width,height
4.align
param用来定义Java小应用程序中的参数
1.name
2.value(值)给变量赋值
3.valuetype(值类型 data表示value指定的值将作为一个字符串传递的对象
ref表示value指定的值是一个URL
object表示value指定的值是一个指向同一文档中一个object的标志符)
4.type(类型)当valuetype属性的值设置为ref时，此属性指定了URL所代表资源的内容类型
<object>
<param></param>
......
</object>
object可以定义很多种不同的多媒体文件
1.classid:该属性指定了浏览器中用来播放相应多媒体对象的控件ID
2.codebase:定义多媒体文件相对位置的根目录
3.codetype:指定当下载由classid所指定的对象时使用的数据内容的类型
4.data:定义多媒体文件的位置
5.type:定义多媒体文件的类型
6.width,height
selector{property1:value1;property2:value2......}selector表示需要应用式样的对象
property表示由css标准定义的样式属性
value表示样式赂性的值
例:h2{text-align:center;font-family:楷体_gb2312}
selector.classname{property1:value1;......} 标记符类
.classname{property:value;......} 通用类
#IDname{property:value;......}用户定义ID
虚类
a:link或:link 当超链接末被访问过时，超链接的显示方式a:visited或:visited 当超链接已经被访问过时，超链接的显示方式
a:active或:active当超链接当前为选中姿态时，超链接的显示方式
a:hover或:hover 当鼠标指针悬停在超链接上时，超链接的显示方式
例: a:link{color:blue}
长度单位
1.em:它所代表的长度是当前字体中m字母的宽度2.ex:它所代表的长度是当前字体中x字母的高度
3.px:像素，它是相对于计算机屏幕的分辨率来定义的
in:英寸，1in=2.54cm 1cm=10mm
pt:点,1点=1/72in pc:帕 1帕=12点
font-family(字体族)
font-family:字体名称 | 字体族名称例：p{font-family:黑体，宋体，serif}
font-style(字体风格)
font-style:字体风格名称
例: p{font-style:oblique}
font-size(字体大小)
font-size:绝对大小 | 相对大小 | 百分比
font-variant(字体变形)
font-varient:字体变形值1.normal(普通)
2.small-caps(小型大写字母)
font-weight(字体加粗)
font-weight:字体加粗值1.normal(普通)
2.bold(加粗)
3.bolder(更粗)
4.lighter(更细)
letter-spacing(字符间距)
letter-spacing:数值text-decoration(文字修饰)
text-decoration:文字修饰效果1.none 无
2.underline 下划线
3.overline 上划线
4.line-through 删除线
5.bink 闪烁
text-transform(文本转换)
text-transform:文本转换方式1.none 无
2.capitalize 使所有单词的第一个字母大写
3.uppercase 使所有单词字母都大写
4.lowercase 使所有单词字母都小写
text-align(文本对齐方式)
text-align:对齐方式1.left
2.right
3.justify 可调整
text-indent(文本缩放)
text-indent:缩放的数值line-height(行高)
line-height:数值
margin(页边距)
margin:数值padding(填充距)
padding:数值
例： table{padding:2cm 3cm 5cm}上填充距2cm,左右填充距为3cm,下填充距5cm
border-style(边框样式)
border-style:边框样式1.none
2.dotted 点线
3.dashed 虚线
4.solid 实线
5.double
6.groove 凹线
7.ridge 凸线
8.inset 内陷
9.outset 外凸
border-color(边框颜色)
border-color: 颜色值border-width(边框宽度)
border-width:数值
1.thin 细
2.medium 中
3.thick 宽
border(边框)
border:边框样式|边框宽度|边框颜色例: h1{border:5px solid red}
float(浮动)
float:参数1.none
2.left
3.right
PS：此文仅为备份所用
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 基础HTML： label标签的for属性
- HTML基础教程第3课-文字标签属性和文字布局相关知识
- HTML基础 body标签alink属性设置带有超链接的文本点击时变的颜色
- html基础 base target 设置a标签target属性的缺省值
- HTML基础 table标签cellspacing属性设置单元格与单元格、边框之间的距离
- HTML基础标签属性详细解析
- HTML基础篇（标签和属性整--已剔除不被浏览器支持的部分）
- HTML基础 body标签link属性设置带有超链接的文本未点击时候的颜色
- HTML基础 img标签alt属性 当图片加载失败的时候显示为文本
- HTML基础（入门、开发、中文问题、标签、元素、属性、注释）
- HTML基础（body标签属性）
- html基础研究(六)-通过标签子标签开与关、属性、内容以及嵌套来了解段落元素
- HTML基础：标签属性和元素
- HTML基础 body标签text属性将普通文本颜色改为白色，实现有趣的密文效果
- HTML基础标签属性详细解析
- HTML基础（body标签属性）
- html基础--标签，属性，文本格式化标签，计算机输出标签，引用和术语定义
- web页面化工作的前期基础学习（二）——HTML标签属性
- html基础-图片标签、表格的属性、链接的属性及链接的分类、name定义锚点的名称、网页的自动刷新、基本字符
- HTML基础 table标签cellpadding属性设置单元格中的文本与单元格的距离