HTML学习总结
HTML学习总结
HTML：Hypertext Marked Language
即超文本标记语言,是一种用来制作超文本文档的简单标记语言。超文本传输协议规定了浏览器在运行 HTML 文档时所遵循的规则和进行的操作.
创建一个HTML文档，需要两个工具，一个是HTML编辑器，一个WEB浏览器。
HTML编辑器是用于生成和保存THML文档的应用程序。
WEB浏览器是用来打开WEB网页文件，提供给我们查看WEB资源的客户端程序。
<HTML></HTML>在文档的最外层，文档中的所有文本和html 标签都包含在其中，它表示该文档是以超文本标识语言（HTML）编写的。
<HEAD></HEAD>是HTML文档的头部标签, 在浏览器窗口中，头部信息是不被显示在正文中的,在此标签中可以插入其它标记, 用以说明文件的标题和整个文件的一些公共属性。
<title>和</title>是嵌套在<HEAD>头部标签中的，标签之间的文本是文档标题，它被显示在浏览器窗口的标题栏
<BODY> </BODY>标记一般不省略，标签之间的文本是正文，是在浏览器要显示的页面内容
HTML的标签分单标签和成对标签两种
单独标签：<标签名>
<标签名字 属性1 属性2 属性 3 … >内容</标签名字>
作为一般的原则，大多数属性值不用加双引号。但是包括空格、％号，＃号等特殊字符的属性值必须加入双引号。为了好的习惯，提倡全部对属性值加双引号。如：
<font color="#ff00ff" face="宋体" size="30">字体设置</font>
文字版面的编辑
3-1 换行 <br> 单标签
3-2 换段落标签<p> 单独、成对
格式：
<P>
<P ALIGN= 参数>
其中,ALIGN 是<p>标签的属性,属性有三个参数 left,center,right.这三个参数设置段落文字的左,中,右位置的对齐方式.
3-3 原样显示文字标签<pre> 成对、
3-4 居中对齐标签<center> 成对标签
3-5 引文标签 (缩排标签）<blockquote>
<BLOCKQUOTE>
</BLOCKQUOTE>
<BLOCKQUOTE><BLOCKQUOTE>
</BLOCKQUOTE></BLOCKQUOTE>
<BLOCKQUOTE><BLOCKQUOTE><BLOCKQUOTE>
</BLOCKQUOTE></BLOCKQUOTE></BLOCKQUOTE>
3-6水平分隔线标签<hr> 单独
3-7署名标签<address> <address></address>标签之间的文字显示效果是斜体字。
3-8特殊字符
注：©是版权声明前的圈
3-9注释标签
<!--注释的内容-->
<!注释的内容>
3-10 字体属性
3-10-1标题标签的格式：<hn align=参数〉标题内容</hn>
说明：<hn>标签是成对出现的，<hn>标签共分为六级，在<h1>...</h1>之间的文字就是第一级是最大最粗的标题；<h6>...</h6>之间的文字是最后一级，是最小最细的标题文字。align 属性用于设置标题的对齐方式，其参数为 left（左）， enter（中)， right (右）。<hn>标签本身具有换行的作用，标题总是从新的一行开始。
文字格式控制标签<FONT>
3-10-2 <FONT>标签用于控制文字的字体，大小和颜色
3-10-3特定文字样式标签
a 物理类型标签
粗体标签<b>
放在<b>与</b>标签之间的文字将以粗体方式显示。
斜体标签<i>
放在<i>与</i>标签之间的文字将以斜体方式显示。
下划线标签<u>
放在<u>与</u>标签之间的文字将以下划线方式显示。
b 常用的逻辑类型标签有八种，放在标签之间的文字受其控制
em标签：<em>用于强调的文本，一般显示为斜体字</em>
strong标签：<strong>用于特别强调的文本，显示为粗体字</strong>
cite标签：<cite>用于引证和举例，通常是斜体字</cite>
code标签：<code>用来指出这是一组代码</code>
small标签：<small>规定文本以小号字显示</small>
big标签：<big>规定文本以大号字显示</big>
samp标签：<samp>显示一段计算机常用的字体，即宽度相等的字体</samp>
kbd标签：<kbd>由用户输入文本，通常显示为较粗的宽体字</kbd>
var标签：<var>用来表示变量，通常显示为斜体字</var>
dfn标签：<dfn>表示一个定义或说明，通常显示为斜体字</dfn>
sup标签：12<sup>2</sup>=144
sub标签：硫酸亚铁的分子式是Fe<sub>2</sub>SO<sub>4</sub>
建立列表
4-1 无序列表<UL>
格式 1:
<UL>
<LI>第一项
<LI>第二项
<LI>第三项
</UL>
格式 2
<ul>
<li type=disc>第一项
<li type=circle>第二项
<li type=square>第三项
</ul>
<LI>的属性 type
disc 实心园
circle空心园
square小方块
4-2 有序列表<OL>
有序列表和无序列表的使用格式基本相同，它使用标签<ol></ol>，每一个列表项前使用<li>。<ol>列表的结果是带有前后顺序之分的编号。如果插入和删除一个列表项，编号会自动调整。
4-3 嵌套列表
4-4 定义列表的标记<DL>/<DT>/<DD>
<dl>
<dt>第 1项 <dd>注释 1
<dt>第 2项 <dd>注释 2
<dt>第 3项 <dd>注释 3
</dl>
第一层为列表项标签<DT>，第二层为注释项标签<DD>。<DT>和<DD>标签通常是成对使用的。
4-5 目录列表<DIR>和菜单列表<MENU>
格式 1:
<dir>
<li>第一项
<li>第二项
<li>第三项
</dir>
格式 2
<menu>
<li type=disc>第一项
<li type=circle>第二项
<li type=square>第三项
</menu>
图像的处理
5-1 背景图像的设定
<body background= "image-url">
5-2 网页中插入图片标签<img>
<IMG> 的格式及一般属性设定：
<img src="logo.gif" width=100 height=100 hspace=5 vspace=5 border=2 align="top" alt="Logo of PenPals Garden" lowsrc="pre_logo.gif">
5-2 设定上下左右空白位置 hspace/vspace
<img src="../../imge/6-5.gif" align="left" hspace="20" vspace="20">
5-2-3 设定字画对其方式
图像的对齐：
1) 单独占一行时，放在<p>…</p>中，用<p>的对齐属性进行设置。
2) 与文本在同一行时，用其自身的 align 属性（top,middle,bottom）设置图像与文本的垂直对齐。其中：bottom为默认值。
3) 图文混排时，可实现图像的左、右环绕文本，用 align 属性（left 图像在左、文本在右,right）。
<img src="../../imge/6-2.jpg" align="left">
<img src="../../imge/6-2.jpg" align="right">
<img src="../../imge/6-2.jpg" align="top">
<img src="../../imge/6-2.jpg" align=bottom>
<p><img src="../../imge/6-2.jpg" align="middle">
5-2-4 图片大小设定
<img src="../../imge/6-3.gif" width="350" height="200">
5-2-5 图像边框的设定
<img src="../../imge/xjbjtp22.jpg" border="10">
建立超链接
建立超链接的标签为<A>和</A>
格式：<A HREF="资源地址" TARGET="窗口名称" TITLE="指向连接显示的文字">超链接名称</A>
属性“HREF”定义了这个链接所指的目标地址；目标地址是最重要的，一旦路径上出现差错，该资源就无法访问
TARGET:该属性用于指定打开链接的目标窗口，其默认方式是原窗口。
建立目标窗口的属性
属性值 描 述
_parent 在上一级窗口中打开，一般使用分桢的框架页会经常使用
_blank 在新窗口打开
_self 在同一个桢或窗口中打开，这项一般不用设置
_top 在浏览器的整个窗口中打开，忽略任何框架
TITLE：该属性用于指定指向链接时所显示的标题文字
TABLE
在html 文档中，表格是通过<table>,<th>,<tr>,<td>标签来完成的
7-2（2） 设置分隔线的显示状态 rules
7-2（3） 表格的边框显示状态 frame
7-3 表格行的设定
<TR> 的参数设定（常用）：
<tr align="RIGHT" valign="MIDDLE" bgcolor="#0000FF" bordercolor="#FF00FF"
bordercolorlight="#808080" bordercolordark="#FF0000">
7-4 单元格的设定
<th>和<td>都是插入单元格的标签，这两个标签必须嵌套在<tr>标签内。是成对出现的
7-7 表格的标题标签<caption>
网页的动态、多媒体效果
8-1 滚动字幕<marquee>...</marquee>
8-2 插入多媒体文件
<EMBED SRC="音乐文件地址">
嵌入背景音乐
<BGSOUND src="your.mid" autostart=true loop=infinite>
将音乐做成一个链接，只需用鼠标在上面单击，就可以听音乐了
<A HREF="音乐地址">乐曲名</A>
多视窗口框架
语法格式：
<html>
<head>
</head>
<frameset>
<frame src="url地址1">
<frame src="url地址2">
......
<frameset>
</html>
可以做导航
浮动窗口<iframe>
<iframe src="iframe.html" name="test" align="MIDDLE" width="300" height="100"
marginwidth="1" marginheight="1" frameborder="1" scrolling="Yes">
表单
表单在Web网页中用来给访问者填写信息，从而能采集客户端信息，使网页具有交互的功能。一般是将表单设计在一个Html 文档中，当用户填写完信息后做提交(submit)操作，于是表单的内容就从客户端的浏览器传送到服务器上，经过服务器上的 ASP 或 CGI 等处理程序处理后，再将用户所需信息传送回客户端的浏览器上，这样网页就具有了交互性。
表单 <form></form>
属性 action method和target
form action="用来接收表单信息的url">，如果这个属性是空值("")则当前文档的url 将被使用
method
GET方式是处理程序从当前Html 文档中获取数据
POST当前的Html 文档把数据传送给处理程序
target用来指定目标窗口或目标帧。可选当前窗口_self,父级窗口_parent,顶层窗口_top,空白窗口_blank。
写入标记<input>
<input 属性1 属性2......>
常用属性：
1 name 控件名称
2 type控件类型 如：botton 普通按钮，texe 文本框等
3 align 指定对齐方式,可取top, bottom, middl
4 size 指定控件的宽度
5 value 用于设定输入默认值
6 maxlength在单行文本的时候允许输入的最大字符数
7 src 插入图像的地址
8 event 指定激发的事件
菜单下拉列表框<select></select><option>
多行的文本框.<textarea></textarea>
