2.2 HTML的一些基本标记 课件 -2022-2023学年高一下学期（中职）《网页设计与制作》（高等教育出版社）

网页设计与制作 第02章_HTML 本章内容 HTML基础知识 HTML的一些基本标记 HTML表格标记 HTML框架标记 HTML滚动字幕和多媒体标记 2 网页设计与制作 2.2 HTML的一些基本标记 2.2.1 HTML基本结构标记 HTML文档的基本结构通常由三对标记来构成，它们是<html></html>、<head></head>、<body></body> <html> <head> 这里定义文档的头部，如网页标题、关键词、作者等 </head> <body> 这里定义文档的主体，如文本、图像、表格、超链接等 </body> </html> 3 网页设计与制作 2.2 HTML的一些基本标记 1．<html></html> <html></html>标记对主要用于声明当前文件中包含的是HTML编码信息。<html>标记位于HTML文档最开头，用来标识文档的开始。而</html>标记恰恰相反，它放在文档最末尾，用来标识文档的结束。所有其他HTML标记和文档内容都包含在这对标记之间。 4 网页设计与制作 2.2 HTML的一些基本标记 2．<head></head> <head></head>标记对之间的内容主要用于定义HTML文档的头信息，如标题、脚本、说明内容等等，不会在浏览器的文档窗口中显示出来，其中可包括<title></title>、<script></script>、<meta>等标记。下面简要介绍一下<meta>标记的几种典型用法。 （1）<meta name="Keywords" content="study,computer">：用来告诉搜索引擎当前网页有哪些关键字，此处的代码意味着当前网页有两个关键字：study和computer。 （2）<meta name="Author" content="John">：用来标注网页的作者姓名，此处的代码意味着当前网页的作者是John。 （3）<meta http-equiv="Content-Type" content="text/html; charset=gb2312">：用来标注当前网页的字符集即解码方式，此处的代码意味着当前网页的字符集为gb2312。 （4）<meta http-equiv="Refresh" content="5;URL=http://www.baidu.com/">：用来设置网页的自动刷新，此处的代码意味着当前网页在5秒钟后会自动刷新并转到百度首页。 5 网页设计与制作 5 2.2 HTML的一些基本标记 3．<body></body> <body></body>标记对之间的内容是HTML文档的主体部分。对于浏览器而言，<body></body>就像是一块画布，在此标记对之间可包含<font>、<img>、<table>、<a>、<p>、<br>、<hr>等众多标记，由这些标记所定义的文本、图像、表格等网页元素将会在浏览器中显示出来。 <body>标记有一些属性，可以结合起来一起使用，比如<body bgcolor=“gray” text=“#00FF00”>。其作用是将网页的背景颜色指定为灰色，文字颜色指定为绿色。 6 网页设计与制作 2.2 HTML的一些基本标记 属性 描述 示例 bgcolor 设置网页的背景颜色 <body bgcolor="silver">背景为银色 background 设置网页的背景图片 <body background="logo.gif">网页背景图片为logo.gif text 设置网页的文本颜色 <body text="#00FF00">文本为绿色 link 设置网页链接的颜色 <body link="#0000FF">链接为蓝色 alink 设置正被点击链接的颜色 <body alink="yellow">正被点击链接为黄色 vlink 设置已访问链接的颜色 <body vlink="gray">已访问链接为灰色 leftmargin 设置网页的左边距 <body leftmargin="30">页面左边距为30像素 topmargin 设置网页的上边距 <body topmargin="50">页面上边距为50像素 7 网页设计与制作 表2.2 <body>标记的主要属性 2.2 HTML的一些基本标记 4．<title></title> <title></title>标记对只能放在<head></head>标记对之间，用来指定当前HTML文档的页面标题。标题的显示位置不是在浏览器窗口的文档区，而是在浏览器窗口的标题栏。标题内容的选择应当是具有描述性的、明确的、简洁的。 8 网页设计与制作 2.2 HTML的一些基本标记 2.2.2