动态网站建设与规划

动态网站建设与规划 教学课件主讲：徐洪章 E-Mail:xhz_2003@126.com QQ:5081805

第三讲 HTML内容提要 1、HTML文档结构 2、排版标记 3、多媒体标记 4、链接标记 5、表格标记 6、表单标记 7、框架标记

1、 HTML的基本结构 • 一个HTML文档是由一系列的元素和标签组成.元素名不区分大小写. • HTML用标签来规定元素的属性和它在文件中的位置。 • HTML超文本文档分文档头和文档体两部分，在文档头里，对这个文档进行了一些必要的定义，文档体中才是要显示的各种文档信息。

简单实例 • 下面是一个最基本的html文档的代码：1-1.html • <HTML> ----------------------------------------〉开始标签<HEAD> --------------------------------------<TITLE> 一个简单的HTML示例 </TITLE> | 头部标签</HEAD> -------------------------------------- <BODY> --------------------------------------- <CENTER> | <H1>欢迎光临我的主页</H1> |<BR> |<HR> | 文件主体<FONT SIZE= 7 COLOR= red> | 这是我第一次做主页 | </FONT> |</CENTER> |</BODY> ---------------------------------------</HTML> --------------------------------------- 结尾标签

html的主体标签<body> • 在<body>和</body>中放置的是页面中所有的内容，如图片、文字、表格、表单、超链接等设置。 • <body>标签有自己的属性，设置 <body>标签内的属性，可控制整个页面的显示方式。 • 格式： <body text="#000000" link="#000000" alink="#000000" vlink="#000000" background="gifnam.gif" bgcolor="#000000" leftmargin=3 topmargin=2 bgproperties="fixed">

实例：2-1.html <html><head><title>bady的属性实例</title></head><body bgcolor="#FFFFE7" text="#ff0000" link="#3300FF" alink="#FF00FF" vlink="#9900FF"><center><h2>设定不同的连接颜色</h2>测试body标签<p><a href="http://www.baidu.com/">默认的连接颜色</a><p><a href="http://www.sina.com.cn">正在按下的连接颜色,</a><p><a href="http://www.sohu.com/">访问过后的连接颜色,</a><P><a href="#" onClick="javascript:window.history.back()">返回</a></conter></body></html>

2、排版标记 • 标题标记<hn></hn> • 段落标记<p></p> • 换行标记<br> • 文本标记<font size color face> • 文字风格标记<u><i><b><strike><sup><sub>

3、多媒体标记 图像标记<img ></img> 背景音乐标记<bgsound>

4、链接标记 文件连接锚点链接链接到E-mail 图象链接

5、表格标记 Table标记 Tr标记 Td标记

6、表单标记

7、框架标记 Frameset标记 Frame标记

1、表单的表现形式

2、表单的格式 格式： <FORM action= URL method=postmethod onsubmit= script target=frametarget > <input type=“*” name=“fruit” value =“apple” >苹果 … <input type="submit" value="提交"> <input type=“reset” value=“重置"> </FORM> 功能：定义表单

动态网站建设与规划

动态网站建设与规划

Presentation Transcript