教学项目八 HTML基本标志和格式标志的使用
【 基本内容 】
讲解 HTML基本标志对和格式标志
【 教学要求 】
能熟练运用基本标志对和格式标志对设计网页
一, 案例分析,
<HTML>
<Head>
<title>我的个人网页 </title>
</head>
<body>
<p>欢迎光临我的个人网站
</body>
</html>
网页效果如下,
二、基本标志
1,<html></html>
成对使用,<html>用于文档的最前面,标识 HTML
文档的开始,</html>标识 HTML文档结束 ;
2,<head></head>
构成文档的开头部分,提供文档的整体信息、标题
栏名称、语种等。
3,<title></title>
浏览器窗口最上边显示的文本信息,只能放在
<head></head>标志对之间
4.<body></body>
是 HTML文档的主体部分,用于设定网页背景色,背
景图,文本颜色,超级链接颜色以及使用过的超级链
接颜色等。
主要属性,bgcolor,text,link,vlink,alink
Bgcolor,设定页面背景的颜色
Text,设定页面文字的颜色
Link,设定页面默认的链接颜色
Alink,设定鼠标单击时的链接的颜色
Vlink,设定访问过后的链接的颜色
例,
<html>
<head>
<title>显示在浏览器最上边的蓝色条中的文本 </title>
</head>
<body bgcolor=yellow text=blue link=green
alink=red vlink=black>
<p>黄色背景,蓝色文本
<br>
<a href=mailto:xgzyljj@163.net>联系我们 </a>
<br>
<a href=#>试一试 </a>
</body>
</html>
三,HTML中的格式标志
1,<p></p>
用来创建一个段落,常用的属性为 align
例,
<HTML>
<Head>
<title>格式标志使用 </title>
</head>
<body>
<p align=left>欢迎光临我的个人网站
<p align=center>文字居中
<p align=right>右对齐
</body>
</html>
2,<br>
用于创建一个回车换行符
3.<dl></dl> <dt></dt> <dd></dd>
<dl></dl>创建一个普通的列表
<dt></dt>创建列表的上层项目
<dd></dd>创建列表的下层项目
例,<html>
<head>
<title>一个普通的列表 </title></head>
<body text=blue>
<dl>
<dt>中国城市 </dt>
<dd>北京 </dd> <dd>上海 </dd>
<dd>深圳 </dd> <dt>美国城市 </dt>
<dd>华盛顿 </dd> <dd>纽约 </dd>
<dd>芝加哥 </dd>
</dl> </body>
</html>
4.<ol></ol><ul></ul><li></li>
<ol></ol>创建一个标有顺序号的列表
<ul></ul>创建一个标有圆点的列表
<li></li>用来创建一个列表项
有序列表标志中的属性,
(1)Type,指定列表的类型
Type=1 数字 1,2,3…
Type=a 小写英文 a,b,c…
Type=A 大写字母 A,B,C…
Type=i 小写罗马数字 i,ii,iii…
Type=I 大写罗马数字I,
II,III… (2) Start,指定起始值,默认为 1
无序列表的类型属性 type,
Type=disc ?
Type=circle ?
Type=square ?
例,
<html>
<head>
<title>有序列表的使用 </title>
<body text=blue>
<ol start=3 >
<p>中国城市 </p>
<li type=A >北京 </li>
<li>上海 </li>
<li>深圳 </li>
</ol>
<ul>
<p>美国城市 </p>
<li type=square>华盛顿 </li>
<li>纽约 </li>
<li>芝加哥 </li>
</ul>
</body>
</html>
【 课后小结 】
通过本次课的学习,要求能熟练掌握网页面的基本标志
与格式标志,并能灵活运用列表,有序列表,无序列表标志及
属性,