HTML
- 2. About…
Black-Xstar (Bill Zhong)
billzhong@gmail.com
www.Black-Xstar.com
My Blog and Websites:
http://www.black-xstar.com/blog
http://applife.net
http://www.u3app.com
http://opda.mobi
http://www.3gsurf.com
www.Black-Xstar.com 2
- 3. HTML是什么
超文本标记语言
Hyper Text Markup Language
一种专门为网页设计的标记语言
目前使用最广泛的标记语言之一
www.Black-Xstar.com 3
- 4. HTML的历史
1982 年,Tim Berners-Lee 为使世界各
地的物理学家能够方便的进行合作研究,
建立了使用于其系统的 HTML。
Tim Berners-Lee 设计的 HTML 以纯文本
格式为基础,可以使用任何文字编辑器处
理,最初仅有少量标记(TAG)且易于掌
握运用。
www.Black-Xstar.com 4
- 5. HTML的版本
HTML 2.0,1995年11月。
HTML 3.2,1996年1月14日。
HTML 4.0,1997年12月18日。
HTML 4.01,1999年12月24日。
ISO/IEC 15445:2000,2000年5月15日
发布,基于严格的HTML 4.01语法,是国
际标准化组织和国际电工委员会的标准。
XHTML…
www.Black-Xstar.com 5
- 6. HTML的现状
推荐使用XHTML来代替HTML
XHTML比HTML更加标准和规范
到目前为止,XHTML常用以下几个版本:
XHTML 1.0 Strict(严格版)
XHTML 1.0 Transitional(过渡版)
XHTML 1.0 Frameset(框架版)
XHTML 1.1
www.Black-Xstar.com 6
- 9. 简单的HTML页面
<html>
<head>
○ <title>hello world!</title>
</head>
<body>
○ <p>你好,世界!</p>
</body>
</html>
www.Black-Xstar.com 9
- 10. 基本的HTML结构
<head>…</head>
这部分包括标题和其
<html>…</html> 他说明信息。
标记 HTML 文档的开
<body>…</body>
始和结束
正文部分,包含文本、
图像和链接。
www.Black-Xstar.com 10
- 11. 常用的HTML标签
<title> <b>
<meta> <i>
<h1>… <u>
<p> <font>
<br> <img>
<hr> <a>
……
<ul><li>
<ol><li>
www.Black-Xstar.com 11
- 13. 标签:<meta>
meta是一个特殊的 HTML 标签,提供有
关网页的各种信息,如作者姓名、公司名
称和联系信息等。
meta标签的内容是不会在页面显示出来
的,一般是给浏览器或搜索引擎识别的。
www.Black-Xstar.com 13
- 14. 举例:<meta>
<meta http-equiv=quot;Content-Typequot;
content=quot;text/html; charset=UTF-8quot; />
告诉浏览器,网页编码为UTF-8。
<meta name=quot;descriptionquot; content=quot;这
是一个例子!quot; />
告诉搜索引擎,网页主要内容是什么。
<meta name=quot;robotsquot; content=quot;noindex,
nofollowquot;>
告诉搜索引擎,这个网页不要收录。
• 注意:百度不遵守国际标准,此标签无效。
www.Black-Xstar.com 14
- 15. 标签:<h1>…
H1 到 H6 标签用于指定不同级别的标题
<h1>第一级标题</h1>
<h2>第二级标题</h2>
○ <h3>第三级标题</h3>
<h4>第四级标题</h4>
- <h5>第五级标题</h5>
- <h6>第六级标题</h6>
www.Black-Xstar.com 15
- 16. 标签:<p>
<p>…</p> 标签用于标记段落
<p>第一段</p>
<p>第二段</p>
<p align=quot;leftquot;>左对齐显示</p>
<p align=quot;centerquot;>居中显示</p>
<p align=quot;rightquot;>右对齐显示</p>
www.Black-Xstar.com 16
- 17. 标签:<br>
<br>是强制换行标签,无论什么情况,
见到此标签就立即换行。
和别的标签不同,不需要</br>来结束!
第一行<br>第二行
www.Black-Xstar.com 17
- 18. 标签:<hr>
<hr> 标签用于在页面上绘制水平线
和<br>标签一样,也不需要</hr>来结
束。
第一段<hr>第二段
www.Black-Xstar.com 18
- 19. 标签:<ul><li>
这两个标签是列表标签,连在一起使用的。
<ul>
<li>星期日</li>
<li>星期一</li>
<li>星期二</li>
<li>星期三</li>
<li>星期四</li>
<li>星期五</li>
<li>星期六</li>
</ul>
www.Black-Xstar.com 19
- 20. 标签:<ol><li>
同样是列表标签。不过和<ul>不同,<ol>是有序列表。
在有序列表中,列表项以自动生成的顺序显示 。
<ol>
<li>星期日</li>
<li>星期一</li>
<li>星期二</li>
<li>星期三</li>
<li>星期四</li>
<li>星期五</li>
<li>星期六</li>
</ol>
www.Black-Xstar.com 20
- 22. 标签:<font>
<font>可用于控制网页上文本的显示。
例如用于指定文字的大小,颜色和字体等。
<font size=quot;8quot;>设置大小</font>
<font color=quot;#00FF00quot;>设置颜色</font>
<font face=quot;华文彩云quot;>设置字体</font>
www.Black-Xstar.com 22
- 23. 标签:<img>
这个标签是用来给网页插入图片。
图片必须存在于互联网服务器上。
<img src=quot;http://www.google.com/intl/zh-
CN_ALL/images/logo.gifquot; />
www.Black-Xstar.com 23
- 25. 标签:…
HTML标签还有很多很多。
每个标签的用法可以参考HTML手册。
大多数情况下,并不需要直接编写
HTML。
掌握基本HTML标签,有助于网页设计。
目前流行的网页设计软件:
Microsoft Frontpage
○ Microsoft Expression Web
Adobe Dreamweaver
www.Black-Xstar.com 25
- 26. Dreamweaver 介绍
原本由 Macromedia 公司所开发。
2005年4月18日,Macromedia 被 Adobe
以34亿美元价格收购。
第一个版本1.0发布于1997年12月,最新
版本CS4发布于2008年9月23日。
集网页制作和网站管理于一身的所见即所
得网页编辑器,亦有HTML编辑的功能。
www.Black-Xstar.com 26
- 28. Dreamweaver 使用
默认 XHTML 1.0 Transitional 规范
所见即所得!
www.Black-Xstar.com 28
- 30. 谢谢!
不足之处,敬请指正。
Email:billzhong@gmail.com
Blog:http://www.black-xstar.com/blog
本演示文稿可在我的博客获得。
www.Black-Xstar.com 30