头部和主体标签_第1页
头部和主体标签_第2页
头部和主体标签_第3页
头部和主体标签_第4页
头部和主体标签_第5页
已阅读5页，还剩39页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

头部和主体标签第一页，共四十四页，2022年，8月28日本章内容2.1HTML标签与元素2.2HTML头部内容2.3HTML主体内容2.4颜色的设置第二页，共四十四页，2022年，8月28日2.1HTML标签与元素HTML文档是由HTML元素构成的文本文件。HTML元素是通过使用HTML标签进行定义的。HTML标签是用来标记HTML元素的。HTML标签被<和>符号包围。这些包围的符号叫作尖括号。HTML标签通常是成对出现的。例如<b>和</b>。位于起始标签和终止标签之间的文本是元素的内容。HTML标签对大小写不敏感，<b>和<B>的作用的相同的未来WEB标准要求HTML标签代码统一采用小写第三页，共四十四页，2022年，8月28日示例标签元素第四页，共四十四页，2022年，8月28日<html><head>········</head><body>········</body></html>头部（Head）主体（Body）描述浏览器所需的信息包含所要说明的具体内容

第五页，共四十四页，2022年，8月28日2.2HTML头部内容2.2.1HTML头部标签2.2.2<base>定义和用法2.2.3<basefont>定义和用法2.2.4<meta>定义和用法第六页，共四十四页，2022年，8月28日2.2.1HTML头部标签标签含义<base>基底网址标签<basefont>基准文字标签<title>标题标签<meta>元信息标签<style>样式标签<link>外部链接标签<script>脚本标签第七页，共四十四页，2022年，8月28日2.2.2<base>定义和用法定义和用法<base>标签为页面上的所有链接规定默认地址或默认目标。通常情况下，浏览器会从当前文档的URL中提取相应的元素来填写相对URL中的空白。使用<base>标签可以改变这一点。浏览器随后将不再使用当前文档的URL，而使用指定的基本URL来解析所有的相对URL。这其中包括<a>、<img>、<link>、<form>标签中的URL。第八页，共四十四页，2022年，8月28日<base>基本语法基本语法：

<basehref="url"target="womdow_name">语法解析：

href属性指定文档的基础URL地址，该属性在<base>标签中是必须存在的；Target属性定义打开页面的窗口，取值如表所示：属性值描述_parent将网页加载到包含该链接的框架的父框架或窗口中_blank将网页加载到一个新的未命名的浏览器窗口中_self将网页加载到与链接相同的框架或窗口中_top将网页加载到整个浏览器窗口中，并删除所有框架第九页，共四十四页，2022年，8月28日实例（基底网址.htm）第十页，共四十四页，2022年，8月28日2.2.3<basefont>定义和用法定义和用法<basefont>标签可以设定基准的文字字体、字号和颜色。一旦遇到页面中其他相关标签未定义文字或段落的样式时，将套用基准的文字样式。只有InternetExplorer

支持<basefont>标签。应该避免使用该标签。在HTML4.01中，不赞成使用basefont元素；在XHTML1.0StrictDTD中，不支持basefont元素。第十一页，共四十四页，2022年，8月28日<basefont>基本语法基本语法：

<basefontface="font_name1,font_name2,…"size="value"color="value">语法解析：

face定义了字体，多种字体间用","分开；size定义了字号，value取值范围为1~7或-1~-7或+1~+7；color定义了颜色，value值为英文名称或十六进制代码。第十二页，共四十四页，2022年，8月28日实例（基准文字.htm）第十三页，共四十四页，2022年，8月28日2.2.4<meta>定义和用法定义和用法<meta>元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。<meta>标签位于文档的头部，不包含任何内容。<meta>标签的属性定义了与文档相关联的名称/值对。第十四页，共四十四页，2022年，8月28日<meta>基本语法基本语法：

<metaname="…"content="…"><metahttp-equiv="…"content="…">语法解析：

meta标签分为两大部分：HTTP标题信息（http-equiv

）和页面描述信息（name

）。第十五页，共四十四页，2022年，8月28日http-equiv属性http-equiv类似于HTTP的头部协议，他回应给浏览器一些有用的信息，以帮助正确和精确的显示网页内容。使用带有http-equiv属性的<meta>标签时，服务器将把名称/值对添加到发送给浏览器的内容头部。

常见类型有content-type（文档类型）、refresh（刷新）expires（日期时间）、event（事件）等。第十六页，共四十四页，2022年，8月28日类型一：content-type当服务器向浏览器发送文档时，会先发送许多名称/值对。虽然有些服务器会发送许多这种名称/值对，但是所有服务器都至少要发送一个：content-type:text/html。这将告诉浏览器准备接受一个HTML文档。<metahttp-equiv="content-type"content="text/html;charset=gb2312"

/>第十七页，共四十四页，2022年，8月28日常用编码类型：

GB2312简体中文

utf-8简体中文

HZ简体中文（新加坡）

BIG5繁体中文（台湾）

ISO-8859-1英文第十八页，共四十四页，2022年，8月28日类型二：refresh每隔几秒钟后刷新页面内容，不仅能够完成页面自身的自动刷新，也可以实现页面之间的跳转过程。<metahttp-equiv="refresh"content="5;url="/>解析：5为跳转间隔的时间，单位为秒；url取值为跳转后打开的文件地址，可省略，默认为当前文档地址。第十九页，共四十四页，2022年，8月28日类型三：cache-control禁止客户端浏览器缓存网页内容。<metahttp-equiv="cache-control"content="no-cache"/>解析：cache-control为缓存控制，content中定义了禁止缓存功能。第二十页，共四十四页，2022年，8月28日类型四：expires设定网页在客户端浏览器缓存的有效期限。<metahttp-equiv="expires

"content="星期,日月年时分秒gmt"/>解析：expires为缓存期限，content中定义了到期时间，其内为标准格式，都使用英文和数字进行设定，如："fri,31dec2010114005"，则到期时间为2010年12月31日星期五上午11点40分05秒。注意：必须使用GMT的时间格式，或直接设为数字(表示多少秒后过期)。第二十一页，共四十四页，2022年，8月28日类型五：转场效果(IE)转场效果即网页过渡，进入或离开网页时的切换效果。<metahttp-equiv="event

"content="revealtrans(duration=value,transition=number)

"/>解析：event为转场效果事件名称，取值有：enter/exit(进入/退出本网页时有网页过渡效果)；duration设定转场效果持续时间，最大可设为30秒；transition为过渡效果的编号，可设置24种切换效果，取值范围为0~23。第二十二页，共四十四页，2022年，8月28日过渡效果表效果效果编号效果效果编号盒状收缩0向左擦除6盒状展开1向右擦除7圆形收缩2垂直百叶窗8圆形展开3水平百叶窗9向上擦除4横向棋盘式10向下擦除5纵向棋盘式11第二十三页，共四十四页，2022年，8月28日过渡效果表（续表）效果效果编号效果效果编号溶解12阶梯状向左上展开18左右向中部收缩13阶梯状向右下展开19中部向左右展开14阶梯状向右上展开20上下向中部收缩15随机线条21中不向上下展开16随机垂直线条22阶梯状向左下展开17随机23第二十四页，共四十四页，2022年，8月28日类型六：淡入淡出效果(IE)实现网页以淡入淡出效果进行切换。<metahttp-equiv="event

"content="blendtrans(duration=value)

"/>解析：event为转场效果事件名称，取值有：enter/exit(进入/退出本网页时有网页过渡效果)；duration设定转场效果持续时间，最大可设为30秒；。第二十五页，共四十四页，2022年，8月28日name属性name属性主要用于描述网页内容。与之对应的属性值为content，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。常见类型有Keywords、description、robots、author、generator等。第二十六页，共四十四页，2022年，8月28日类型一：Keywordskeywords用来告诉搜索引擎你网页的关键字是什么。便于搜索引擎搜索网页，关键字之间要用逗号分割。Google建议Keywords的字符数串不超过20个。

<metaname="keywords

"content="value1,value2,value3"/>第二十七页，共四十四页，2022年，8月28日类型二：description

description用来告诉搜索引擎你的网站主要内容。Description详细信息（Google建议Description的字符数不超过200个）。<metaname="description

"content="value1,value2,value3"/>第二十八页，共四十四页，2022年，8月28日类型三：robotsrobots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。<metaname="robots

"content="all

"/>content的参数有all,none,index,noindex,follow,nofollow，默认是all。

并不是所有的搜索引擎都支持这个tag，它们共同支持一个功能更强的，叫做robots.txt的文本文件来达到上述功能。

第二十九页，共四十四页，2022年，8月28日类型四：author说明：标注网页的作者。<metaname="author

"content="作者名字

"/>举例：<metaname="author"content="sdxhbm@">。

第三十页，共四十四页，2022年，8月28日类型五：generator说明：标注设计网页的编辑器。<metaname="generator

"content="编辑器名称

"/>举例：<metaname="author"content="notepad">。

第三十一页，共四十四页，2022年，8月28日综合应用第三十二页，共四十四页，2022年，8月28日2.3HTML主体内容2.3.1主体标签<body>2.3.2正文颜色2.3.3链接颜色2.3.4背景2.3.5边距第三十三页，共四十四页，2022年，8月28日2.3.1主体标签<body>定义和用法在<body>和</body>中放置的是页面中所有的内容，如图片、文字、表格、表单、超链接等设置。。<body>标签有自己的属性，设置<body>标签内的属性，可控制整个页面的显示方式。基本语法：<bodyattribute="…">。语法解析：attribute指body标签的属性名，如定义文字颜色、背景颜色、背景图片等。第三十四页，共四十四页，2022年，8月28日Body标签属性表属性描述text设置页面文字的颜色link设置初始的链接颜色alink设置鼠标单击时的链接颜色vlink设置访问后的链接颜色background设置页面背景图像（在css中设置重复属性）bgcolor设置页面背景颜色bgproperties设置页面背景图像为固定，不随页面的滚动而滚动第三十五页，共四十四页，2022年，8月28日Body标签属性表（续）属性描述leftmargin设置页面的左边距topmargin设置页面的上边距rightmargin设置页面的右边距bottommargin设置页面的下边距第三十六页，共四十四页，2022年，8月28日2.3.2正文颜色设定页面文字颜色的body标签的属性：text

。作用范围：页面中所有的未单独进行定义颜色的文字。

<bodytext="color_value">color_value取值为颜色英文单词或十六进制值，如"red/#FF0000"

。第三十七页，共四十四页，2022年，8月28日2.3.3链接颜色与页面链接颜色相关的body标签的属性有：link、alink、vlink

。link

定义默认的没有点击过的初始链接文字颜色，alink定义鼠标点击链接文字时的链接文字颜色，vlink定义点击过后的链接文字颜色。

<bodylink="color_value"alink="color_value"vlink="color_value">color_value取值为颜色英文单词或十六进制值，如"red/#FF0000"

。第三十八页，共四十四页，2022年，8月28日2.3.4背景与页面背景相关的body标签的属性有：bgcolor、background、bgproperties

。bgcolor定义页面的颜色，background定义页面的背景图像，bgproperties定义背景属性。

<bodybgcolor="color_value"background="img_file_url"bgproperties="fixed">color_value取值为颜色英文单词或十六进制值，如“red/#FF0000”

；img_file_url指图片文件所在的路径，即指向图像文件所在位置的地址；通过bgproperties定义了背景属性，fixed设为固定效果。第三十九页，共四十四页，2022年，8月28日2.3.5边距与页面边距相关的body标签属性有：leftmargin、rightmargin、topmargin、bottommargin

。leftmargin、rightmargin、topmargin、bottommargin分别定义页面左边距、右边距、上边距、下边距，即内容和浏览器左部、右部、上部、下部边框之间的距离。

<bodyleftmargin="value"rightmargin="value"topmargi

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论