没有合适的资源?快使用搜索试试~ 我知道了~
HTML基础知识点汇总
需积分: 47 1.6k 浏览量
2017-12-04
18:44:14
上传
评论 3
收藏 1.61MB DOC 举报
温馨提示
HTML基本标签汇总讲义。虽然只有短短几页但基本包含了html所有标签。对初学者是必不可少的资料。
资源推荐
资源详情
资源评论











第 1 章 网页设计概述
1.4 HTML 基础知识
Internet 风行世界,作为展现 Internet 风采的重要载体,Web 页受到了愈来愈多人的重视。好的
Web 页可以吸引用户频频光顾站点,从而达到宣传网站的目的。 Web 页是由 HTML(Hypertext
Markup Language,超文本标记语言)组织起来的,由浏览器解释显示的一种文件。
最初的 HTML 语言功能极其有限,仅能够实现静态文本的显示,人们远远不满足于死板的类似于
文本文件的 Web 页。后来增强的 HTML 语言扩展了对图片、声音、视频影像的支持。
通过浏览器访问到的 Web 页面,通常是基于 HTML 的基础上所形成的。那么,什么是 HTML 呢?
下面将介绍有关 HTML 的概念及其基本语法。
1.4.1 HTML 概念
当畅游 Internet 时,通过浏览器所看到的网站是由 HTML 语言所构成的。HTML 是一种建立网页
文件的语言,通过标记式的指令(Tag),将影像、声音、图片、文字等连接显示出来。这种标记性
语言是因特网上网页的主要语言。
HTML 网页文件可以使用记事本、写字板或 Dreamweaver 等编辑工具来编写,以.htm 或.html 为
文件后缀 名保存。将 HTML 网页文件 用浏览器打开显示,若测试没有问题则可以放到服务器
(Server)上,对外发布信息。
1.4.2 HTML 基本语法
HTML 标记是由“<”和“>”所括住的指令标记,用于向浏览器发送标记指令。主要分为:单标记指
令、双标记指令(由“<起始标记>”+内容+“</结束标记>”构成)。
HTML 语言使用标志对的方法编写文件,既简单又方便。它通常使用“<标志名>内容</标志名>”
来表示标志的开始和结束,因此在 HTML 文档中这样的标志对都必须是成对使用的。
为了便于理解,将 HTML 标记语言大致分为基本标记、格式标记、文本标记、图像标记、表格标
记、链接标记、表单标记和帧标记等。
1.4.3 基本标记
基本标记是用来定义页面属性的一些标记语言。通常一份 HTML 网页文件包含 3 个部分:标头区
<HEAD>……</HEAD>、内容区<BODY>……</BODY>和网页区<HTML>……</HTML>。
1.<html>……</html>
<html>标志用于 HTML 文档的最前边,用来标识 HTML 文档的开始。而</html>标志恰恰相反,
它放在 HTML 文档的最后边,用来标识 HTML 文档的结束,两个标志必须一块使用。
·19·

Dreamweaver 网页制作与色彩搭配全攻略
2.<head>……</head>
<head> 和 </head> 构 成 HTML 文 档 的 开 头 部 分 , 在 此 标 志 对 之 间 可 以 使 用 <title></
title>、<script></script>等标志对。这些标志对都是用来描述 HTML 文档相关信息的,<head>和</
head>标志对之间的内容是不会在浏览器的框内显示出来的,两个标志必须一块使用。
3.<body>……</body>
<body>和</body>是 HTML 文档的主体部分,在此标志对之间可包含<p>……</p>、<h1>……</
h1>、<br>、<hr>等众多的标志。它们所定义的文本、图像等将会在浏览器的框内显示出来。<body>
标志主要属性如表 1-1 所示。
表 1-1 <body>标志主要属性
属 性 用 途 范 例
<body bgcolor="#rrggbb">
设置背景颜色 <body bgcolor="#red"> 红色背景
<body text="#rrggbb">
设置文本颜色 <body text="#0000ff">蓝色文本
<body link="#rrggbb">
设置链接颜色 <body link="blue">链接为蓝色
<body vlink="#rrggbb">
设置已使用的链接的颜色 <body vlink="#ff0000">链接为红色
<body alink="#rrggbb">
设置鼠标指向的链接的颜色 <body alink="yellow">黄色
以上各个属性可以结合使用,如<body bgcolor="red" text="#0000ff">。引号内的 rrggbb 是用 6 个
十六进制数表示的 RGB(即红、绿、蓝 3 色的组合)颜色,如#ff0000 对应的是红色。
4.<title>……</title>
使用过浏览器的人可能都会注意到浏览器窗口最上边蓝色部分显示的文本信息,那些信息一般是
网页的主题。要将网页的主题显示到浏览器的顶部其实很简单,只要在<title></title>标志对之间加入
需要显示的文本即可。
下面是一个简单的网页实例。通过该实例,读者便可以了解以上各个标志对在一个 HTML 文档中
的布局或所使用的位置。
<html>
<head>
<title>显示在浏览器窗口最顶端中的文本</title>
</head>
<body bgcolor="red" text="blue">
<p>红色背景、蓝色文本</p>
</body>
</html>
注意:<title></title>标志对只能放在<head></head>标志对之间。
1.4.4 格式标记
这里所介绍的格式标记都是用于<body></body>标志对之间的。
·20·

第 1 章 网页设计概述
1.<p>……</p>
<p></p>标志对是用来创建一个段落,在此标志对之间加入的文本将按照段落的格式显示在浏览
器上。<p>标志还可以使用 align 属性,它用来说明对齐方式,语法如下所示。
<p align="参数"></p>
Align 的参数可以是 Left(左对齐)、Center(居中)和 Right(右对齐)3 个值中的任何一个。例
如<p align="center"></p>表示标志对中的文本使用居中的对齐方式。
2.<br>
<br>是一个很简单的单标记指令,它没有结束标志,因为它用来创建一个回车换行,即标记文本
换行。
注意:如果把<br>加在<p></p>标志对的外边,将创建一个大的回车换行,即<br>前边和后边的文本
的行与行之间的距离比较大。若放在<p></p>的里边则<br>前边和后边的文本的行与行之间
的距离将比较小。
3.<blockquote>……</blockquote>
在<blockquote></blockquote>标志对之间加入的文本将会在浏览器中按两边缩进的方式显示出来。
4.<dl>……</dl>、<dt>……</dt>、<dd>……</dd>
<dl></dl>用来创建一个普通的列表;<dt></dt>用来创建列表中的上层项目;<dd></dd>用来创建
列表中最下层项目,<dt></dt>和<dd></dd>都必须放在<dl></dl>标志对之间。通过下面的实例,读者
可以更好地理解这几个相近的标记。
<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>
该实例在网页中的效果,如图 1-29 所示。
5.<ol>……</ol>、<ul>……</ul>、<li>……</li>
<ol></ol>标志对用来创建一个标有数字的列表。<ul></ul>标志对用来创建一个标有圆点的列表。
·21·

Dreamweaver 网页制作与色彩搭配全攻略
<li></li>标志对只能在<ol></ol>或<ul></ul>标志对之间使用,此标志对用来创建一个列表项,若
<li></li>放在<ol></ol>之间,则每个列表项加上一个数字;若放在<ul></ul>之间,则每个列表项加上
一个圆点。示例如下所示:
图 1-29 格式标记执行效果图
<html>
<head>
<title></title>
</head>
<body text="blue">
<ol>
<p>中国城市 </p>
<li>北京 </li>
<li>上海 </li>
<li>广州 </li>
</ol>
<ul>
<p>美国城市 </p>
<li>华盛顿 </li>
<li>芝加哥 </li>
<li>纽约 </li>
</ul>
</body>
</html>
以上在 IE 中的运行效果如图 1-30 所示。
图 1-30 格式标记执行效果图
·22·
剩余17页未读,继续阅读
资源评论


rawanCreater
- 粉丝: 0
- 资源: 1
上传资源 快速赚钱
我的内容管理 展开
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助


安全验证
文档复制为VIP权益,开通VIP直接复制
