HTML基本标记2.ppt

《HTML基本标记2.ppt》由会员分享，可在线阅读，更多相关《HTML基本标记2.ppt（23页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、HTML基本标记1回顾：l了解互联网l编写简单的 HTML 文档l在 HTML 文档中使用超链接l使用 标记l了解网站的布局结构2目标使用基本标记使用基本标记在在 HTML 文档中插入图像文档中插入图像3基本 HTML 元素l标题标记l段落级标记l块标记l字符级标记l列表l水平标尺标记l字体标记 lIMG 标记4标题标记HTML 简介 HTML 简介 HTML 简介 HTML 简介 HTML 简介 HTML 简介 HTML 简介 可显示六种大小的标题，即可显示六种大小的标题，即到到，为最大，为最大，为最小为最小 5段落级标记：标记,定义地址元素它可以包含下列内容：到主页的链接,搜索字符串功能,

2、版权信息,文档的作者、地址、签名等信息,欢迎学习欢迎学习 HTML我的第一个我的第一个 HTML 文档文档这将是一种很有趣的体验这将是一种很有趣的体验使用另一个标题使用另一个标题 另一个段落元素另一个段落元素单单击此处访问百度主页击此处访问百度主页 6段落级标记：标记学习学习HTMLblockquote元元素素用用于于以以文文本本块块的的形形式式设置内容格式。设置内容格式。汉普蒂汉普蒂邓普蒂坐在墙上邓普蒂坐在墙上汉普蒂汉普蒂邓普蒂摔了一大跤邓普蒂摔了一大跤国王所有的马国王所有的马和所有的人和所有的人也也无无法法再再把把汉汉普普蒂蒂邓邓普普蒂蒂拼拼起来起来请注意，上述内容显示为一个文本块。请注意

3、，上述内容显示为一个文本块。可以使用可以使用BLOCKQUOTE元素显示文档中的引用文本。元素显示文档中的引用文本。BLOCKQUOTE用于较用于较长的引用且显示为缩进式段落。长的引用且显示为缩进式段落。7段落级标记：标记学习学习HTML汉普蒂汉普蒂邓普蒂坐在墙上邓普蒂坐在墙上 汉普蒂汉普蒂邓普蒂摔了一大跤邓普蒂摔了一大跤国王所有的马国王所有的马 和所有的人和所有的人也无法再把汉普蒂也无法再把汉普蒂邓普蒂拼起来邓普蒂拼起来如果希望文本以预定义的格式显示，可以使用如果希望文本以预定义的格式显示，可以使用PRE元素。此元素用于定义文本的元素。此元素用于定义文本的格式。文本在浏览器中显示时遵循在格式

4、。文本在浏览器中显示时遵循在HTML源文档中定义的格式。源文档中定义的格式。8块标记、可以定义跨段落的内容块；可以定义跨段落的内容块；定义段落内的内容块定义段落内的内容块学习学习HTML第第1部分部分元素用于组织元素元素用于组织元素DIV通常用于块级元素通常用于块级元素第第2部分部分这是第二部分这是第二部分您觉得有意思吗？您觉得有意思吗？第二部分向右对齐。第二部分向右对齐。公共格式公共格式应用于这一部分中的所有元素应用于这一部分中的所有元素 9字符级标记.粗体文本.固定宽度的字体./SUP上标文本./SUB下标文本.强调文本.用于显示编程代码.用于引用10字符级标记（示例）字符级标记示例字符级

5、标记示例 圆的面积=pi*r2 水的化学符号：H2O 这是一种很有趣的体验 11列表l无序列表l有序列表l定义列表12无序列表学习 HTML星期一星期一星期二星期二星期三星期三星期四星期四星期五星期五无序列表是一种无序列表是一种“项目符号列表项目符号列表”。其中的项目都带有项目符号前缀。该列表包含在无序列。其中的项目都带有项目符号前缀。该列表包含在无序列表标记表标记.内。列表中的每个项目都使用列表标记内。列表中的每个项目都使用列表标记进行标记，其中进行标记，其中LI表示表示List Item（列表项）。关闭标记列表项）。关闭标记是可选的。是可选的。Type属性默认为属性默认为disc,对应的值

6、为：对应的值为：disc,square,Circle13有序列表学习 HTML星期一星期二星期三星期四星期五 有序列表包含在有序列表包含在.标记内。有序列表也显示列表项目。它与无序列表的区标记内。有序列表也显示列表项目。它与无序列表的区别在于有序列表项前面的编号是可设置的有序编号。别在于有序列表项前面的编号是可设置的有序编号。14自定义编号大写罗马数字 小写罗马数字 大写字母 小写字母 从第n个值开始编号 学习学习HTML 星期一星期一简介简介HTML创建列表创建列表星期二星期二创建表创建表插入图像插入图像星期三星期三星期四星期四星期五星期五 15定义列表学习学习 HTML 星期日星期日 一周

7、的第一天一周的第一天 HTML 超文本标记语言超文本标记语言 互联网互联网 网络的网络网络的网络 定义列表用于生成术语列表（术语和定义）。定义列表包含在定义列表用于生成术语列表（术语和定义）。定义列表包含在.标记内。标记内。标记用于指定要定义的术语，而标记用于指定要定义的术语，而标记用于对术语的定义。标记用于对术语的定义。16水平标尺欢迎使用欢迎使用HTML我的第一个我的第一个HTML文档文档这将会是一种很有趣的体验这将会是一种很有趣的体验 水平标尺标记用于在页面上绘制一条水平线。可借助于下列属性控制水平线。水平标尺标记用于在页面上绘制一条水平线。可借助于下列属性控制水平线。它只有开始标记，没

8、有结束标记，且不包含任何内容。它只有开始标记，没有结束标记，且不包含任何内容。17使用FONT标记欢迎使用欢迎使用HTML我我的第一个的第一个HTML文档文档这这将会将会是一种很有趣的是一种很有趣的体验体验标记用于控制文本在网页上的显示。可以指定标记用于控制文本在网页上的显示。可以指定size（大小）、大小）、color（颜色）颜色）style（样式）等属性。样式）等属性。18添加颜色学习学习 HTML欢欢迎迎使使用用 HTML这这是一种很有趣的体验是一种很有趣的体验可以为页面和页面上的元素添加颜色。可以为页面和页面上的元素添加颜色。COLOR是多个元素（如是多个元素（如FONT和和BODY）

9、都可以都可以使用的属性。使用的属性。19HTML 文档中的图片lGIF（Graphics Interchange Format）图像(.GIF)支持图形渐近透明 GIF 图像支持动画支持无损压缩lJPEG（Joint Photographic Experts Group）图像(.JPG)lPNG（Portable Network Graphics）20插入图像插入图像插入图像 插入图像插入图像底部对齐底部对齐图图2.15：示例：示例15的输出结果的输出结果顶部对齐顶部对齐居中对齐居中对齐 IMG标记用于将图像插入到标记用于将图像插入到HTML文档中。可以将文档中。可以将IMG标记放置在要显示图

10、像的位置。语法为：标记放置在要显示图像的位置。语法为：其中其中SRC是属性，而值是指定图像文件位置的是属性，而值是指定图像文件位置的URL。IMG标记的标记的ALIGN属性可以用于调整图像相对于周围文本的对齐方式。语法为：属性可以用于调整图像相对于周围文本的对齐方式。语法为：21marqueeldirection 表示滚动的方向，值可以是left，right，up，down，默认为left lbehavior 表示滚动的方式，值可以是scroll（连续滚动）slide（滑动一次）alternate（来回滚动）lloop 表示循环的次数，值是正整数，默认为无限循环 lscrollamount 表

11、示运动速度，值是正整数，默认为6 lscrolldelay 表示停顿时间，值是正整数，默认为0，单位是毫秒 lalign 表示元素的垂直对齐方式，值可以是top，middle，bottom，默认为middle lbgcolor 表示运动区域的背景色，值是16进制的RGB颜色，默认为白色 lheight、width 表示运动区域的高度和宽度，值是正整数（单位是像素）或百分数，默认width=100%height为标签内元素的高度 lhspace、vspace 表示元素到区域边界的水平距离和垂直距离，值是正整数，单位是像素。lonmouseover=this.stop()onmouseout=th

12、is.start()表示当鼠标以上区域的时候滚动停止，当鼠标移开的时候又继续滚动。l注释lMARQUEE 元素的默认宽度与其父元素的宽度相等。如果 MARQUEE 位于没有指定宽度的 TD 内，你就需要明确设置 MARQUEE 的宽度。如果 MARQUEE 和 TD 的宽度都没有指定，那么滚动字幕就将限定于 1 个像素宽。l要创建垂直滚动的字幕，请将其 scrollLeft 属性设定为 0。要创建水平滚动的字幕，请将其 scrollTop 属性设定为 0，这将覆盖任何脚本设置。lscrollLeft 和 scrollTop 属性当字幕滚动时为只读。当不处于滚动状态时，scrollLeft 对于设置为水平滚动的字幕来说为可读写，scrollTop 对于设置为垂直滚动的字幕来说为可读写。l 22总结：元素用于显示HTML文档的作者、地址和签名等信息。可使用BLOCKQUOTE元素显示文档中的引用文本。使用字符级标记，控制字符的格式。使用块标记和。列表用于从逻辑上组织数据。使用FONT标记控制字体相关属性。IMG标记用于将图像插入到HTML文档中。23