简介
超文本标记语言(HTML)是Web用于创建和识别文档的标准语言。这些标记都是通过使用标签来完成的,标签可指定网页在浏览器中的显示方式。HTML也称超文本,因为HTML文档包含一些链接,使得用户可以条到同以文档的不同位置或跳到其他文档、图像等。
HTML文档的结构
HTML文档主要由3部分组成。
1.HTML部分:<HTML> </HTML>
2.头部:<HEAD> </HEAD>
3.主题部分:<BODY> </BODY>
如:演示HTML文档的结构
<HTML>
<HEAD>
<TITLE>学习HTML</TITLE>
</HEAD>
<BODY>
<H1>欢迎来到HTML世界</H1>
</BODY>
</HTML>
META标签
METL标签出现在网页的标题部分。这是个特殊的HTML标签,提供有关网页的信息。META标签提供的信息包括作者姓名、公司名称和联系信息等。许多搜索引擎都要使用此信息。META标签使用属性/值的组合。
例如:要将Browne指定为作者
<META name="作者" content="Browne">
1.网页过期(expires)
<META http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
2.自动刷新(refresh)
<METL http-equiv="refresh" content="30">代表每隔30秒自动刷新本页面
<METL http-equiv="refresh" content="5; url=http://www.abc.net">代表过5秒自动跳转到新的url网址
标题标签
HTML提供了六级标题:
<H1>最大标题</H1>
<H2>标题</H2>
<H3>标题</H3>
<H4>标题</H4>
<H5>标题</H5>
<H6>最小标题</H6>
段落级标签
1.段落: <p>用于标记段落的开始,段落结束</p>
2.换行: <BR>
3.<PRE>预格式化标签: <PRE> </PRE>
<PRE>标签用于显示预先已定义好格式的文本。当文本显示在浏览器中时,会遵循已在HTML源文档中定义的格式。
文本格式化标签
1.<B>标签
<B>该文本将以粗体显示</B>
2.<I>标签
<I>该文本将以斜体显示</I>
3.<U>标签
<U>该文本将显示为带有下划线</U>
4.<SUB>标签
<SUB>该文本的显示高度将低于前后的文本</SUB>
5.<SUP>标签
<SUP>该文本的显示高度将高于周围的文本</SUP>
列表
1.无序列表
无序列表标签<UL>...</UL>。列表中每项都用列表标签<LI>列表项</LI>(可以通过设置TYPR属性,改变标号)。
如:
<UL>
<LI>第一项</LI>
<LI>第二项</LI>
<LI>第三项</LI>
</UL>
2.有序列表
有序列表包含在<OL>...</OL>标签内,列表中每项都用列表标签<LI>列表项</LI>。
注意:<OL START=n> START属性指定列表的起始数字 ;我们可以通过设置<LI>标签的TYPR属性,改变编号。
<HR>标签
<HR>(水平线)标签用于在页面上绘制水平线。
<HR>标签属性
属性 | 说明 |
ALIGN | 指定水平线的位置 |
WIDTH | 指定水平线的长度 |
SIZE | 指定水平线的宽度,以像素为单位 |
NOSHADE | 指定水平线以纯色而不是以阴影进行显示 |
如:
<HR noshade size=5 align=center width=50%>
<HR size=15 align=left width=80%>
<FONT>标签
<FONT>标签用于控制网页上文本的显示。文本大小、颜色和样式等属性都可以使用<FONT>标签指定。
<FONT>标签属性
属性 | 说明 |
COLOR | 用于指定字体的颜色 |
SIZE | 用于指定字体的大小 |
FACE | 用于指定字体的类型 |
如:
<FONT SIZE=5 COLOR=BLUE FACE=宋体>文本内容</FONT>
<IMG>标签
<IMG>标签标签用于在HTML文档中插入图片。
<IMG SRC="图片存放位置">
在HTML中使用特殊符字符
字符实体由3部分组成:&号、 实体名称和分号(;)。
如:
空格: 版权号: ©
超级链接
1.链接到其他文档
<A HREF=detai.html>点击此处链接detail。html页面</A>
2.链接到同一文档的各部分
命名锚记也称为锚记,HTML的NAME属性用于创建锚记。
<A NAME="marker">主题名称</A>
为达到这种跳转效果,请在HREF参数中使用如下标记。
<A HREF="#marker">主题名称</A>
注意:符号“#”告诉浏览器当前链接是文档中的一个锚记点。用于在符号“#”前未指定任何文档,浏览器由此知道链接位于同一文档内。
3.链接到其他文档中的特定位置
<A HREF="detail.htm#marker">主题名称</A>
4.电子邮件链接
<A HREF=mailto:pan_junbiao@163.com>
表格
1.<TABLE>...</TABLE>标签用于在HTML文档中创建表格。
2.<TR>...</TR>标签用于定义表格行。
3.<TD>...</TD>标签用于定义每一行中的列,嵌套与<TR>标签内。
4.<CAPTION>表格标题</CAPTION>
如:
<TABLE BORDER=2>
<CAPTION align=top>学生文档信息</CAPTION>
<TR>
<TH>姓名</TH>
<TH>性别</TH>
<TH>分数</TH>
</TR>
<TR>
<TD>张三</TD>
<TD>男</TD>
<TD>80</TD>
</TR>
<TR>
<TD>李四</TD>
<TD>女</TD>
<TD>70</TD>
</TR>
</TABLE>
表单
1.<FORM>标记用于在网页中创建表单区域,属于一个容器标记。
2.HTML输入元素,<INPUT>元素定义要在表单中显示的控件类型和外观。
表单元素类型
1.BUTTON(按钮)
<INPUT TYPE=button VALUE="click" NAME="b1">
2.TEXT(文本)
<INPUT TYPE="Text" name="PID" value="" size="20" maxlength="18">
3.CHECKBOX(复选框)
<input type="checkbox" name="id1" value="深圳" checked>深圳
<input type="checkbox" name="id2" value="北京">北京
<input type="checkbox" name="id3" value="上海" >上海
4.RADIO(单选)
<INPUT type=radio name="sex" value="male">男性
<INPUT type=radio name="sex" value="Female">女性
5.SUBMIT(提交)
<INPUT TYPE=submit VALUE="提交" NAME="b1">
6.RESET(重置)
<INPUT TYPE=reset VALUE="click" NAME="b2">
7.TEXTAREA元素
<textarea name="yj" clos="20" rows="5">
输入区域
</textarea >
8.SELECT元素
<SELECT name="selCountry">
<OPTIOB SELECTED>西班牙</OPTIOB >
<OPTIOB>法国</OPTIOB >
<OPTIOB>巴西</OPTIOB >
<OPTIOB>德国</OPTIOB >
</SELECT >
9.FILE
用来创建文件上载控件,该控件带有一个文本框和一个“浏览”按钮,用户可以在文本框中输入文件路径或单击“浏览”按钮在文件系统中浏览。
<INPUT type="file" name="filepath">
10.HIDDEN元素(隐藏表单域)
可以将一些参数以隐藏表单域的形式发送表单请求(可以用于传递参数),隐藏表单域在页面中不会显示出来,也不占位置,但是作用与“text”一样的,你可以把它当做不显示的“text”。
<INPUT type="hidden" name="boardId" value="10" />
<INPUT type="hidden" name="topicId" value="12" />