《HTML基本标记和网站链接》由会员分享,可在线阅读,更多相关《HTML基本标记和网站链接(42页珍藏版)》请在金锄头文库上搜索。
1、Page 1/42,第1章内容回顾,Dreamweaver MX是一个所见即所得的网页编辑工具,在工作区内提供了便于工作的各种面板和工具栏,可以快速创建网页文档,建立站点为Dreamweaver的网页文本格式化,如粗体、斜体、下划线三种段落格式:段落、标题、和预先格式化的常用的列表样式,如何为设置列表表格可以装载数据,但是更多的是用表格做页面的布局在标准视图下可以为网页插入普通表格在布局视图下插入表格,分层处理布局表格的嵌套关系HTML表格可以装载页面的各种元素,文字、图片、动画、多媒体等等,HTML基本标记和网站链接,第2章,Page 3/42,本章目标,熟悉HTML 文档的基本结构 掌握运
2、用基本标记修改网页格式及外观掌握设置超链接的几种方法以及按照不同目的设置各个目标参数,Page 4/42,本章结构,HTML基本标记和网站链接,标题标记,HTML基础,HTML基本语法,超级链接和路径,URL概述,链接路径,链接类型及目标属性,创建链接,HTML文档结构,HTML基本标记,段落标记,文本格式标记,列表,其他常用标记,使用特殊字符,META 标记,文档结构,HTML表格标记,Page 5/42,HTML基础,进行复杂的网页设计必须学习HTML标记语言HTML(Hypertext Marked Language)超文本标记语言 用HTML编写的超文本文档称为HTML文档 能独立于各
3、种操作系统平台运行 用于描述网页的格式设计和它与web上其它网页的连结信息 HTML并不是一种程序语言,它只是一种排版网页中资料显示的结构语言 需要通过web浏览器显示出效果 超文本语言,是除了文字以外它可以插入图片、声音、动画、视频等多媒体内容,Page 6/42,HTML文档结构,HTML文档结构,一个基本的HTML页面欢迎光临我的主页这是我第一次做主页,无论怎样,我都会努力做得更好! ,开始标记,结尾标记,下面是一个基本的网页的HTML源代码,头标记,文档主体,标签标记 HTML 文档的开始和结束,这部分包括标题和其他说明信息。包括在 标签内,这部分包含文本、图像和链接。它包括在 标签内
4、,在浏览器中的输出结果,Page 7/42,HTML基本语法,HTML的标记有以下三种表示方法 文本或超文本 这是关闭型标记文本或超文本 这是带有可选属性的标记这是“非关闭型”标记,应用举例:关闭型,例如:体标记 hello word! 带有可选属性,例如: 绿色的世界充满了生机和希望! 非关闭型, 、等,Page 8/42,META标记 3-1,META 标记出现在网页的标题部分。META是HTML文档HEAD部分的一个辅助性标记META标记共有两个属性它们分别是http-equiv属性name属性 name属性应用name属性主要用于描述网页,与之对应的属性值为content标注网页的作者
5、,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的,例如,要将 Blue Moka 指定为网页的作者,则使用以下 META 标记:,Page 9/42,META标记 3-2,设定关键字 例如,要用Keywords(关键字)来告诉搜索引擎你网页的关键字是什么索引向导 例如,告诉搜索机器人哪些页面需要索引,哪些页面不需要索引content的参数有all,none,index,noindex,follow,nofollow。,Page 10/42,META标记 3-3,http-equiv属性http-equiv 属性可用来代替 name 属性。http-equiv 类似于HTT
6、P的头部协议,它给浏览器回应一些有用的信息,以帮助正确地显示网页内容Expires(期限),可以用于设定网页的到期时间(GMT的时间格式)refresh(自动刷新),比如间隔5秒网页自动刷新,并指向新的URL网址:,自动刷新的例子,Page 11/42,标题标记,HTML语言提供了六级标题,为最大,为最小,标题这是一级标题这是二级标题这是三级标题这是四级标题这是五级标题这是六级标题,Page 12/42,段落标记 3-1,段落标记 以 开始、 结束通过段落的 align 属性 ,设置段落的对齐方式,如左对齐(left)、居中(center)、右对齐(right),对齐方式我在中间我在左边我在右
7、边,Page 13/42,段落标记 3-2,换行标记 标记在用户要结束一行但又不想开始一个新的段落时使用标记强制换行 没有结束标记, br和P的对比 大家都知道:动物世界中,蓝鲸是最大的哺乳动物。出生时体重为 5 吨。其他哺乳动物就大不相同了!你知道么?,段落标记和换行标记的细微区别:就是它们之间的间隔大小不一样,Page 14/42,段落标记 3-3, 预格式化标记 标签用于显示预先已定义好格式的文本 浏览器中会遵循已在 HTML 源文档中定义的格式显示文本,芭比BOB奇幻魔力奇幻魔力 异次元的大陆里 黑夜来袭 奇幻魔力悄然笼罩著大地 有个魔女渴望爱情的降临 想寻找一个白纸般的心灵 古堡里望
8、星星 王子的眼睛 诉说着他一个奇怪的梦境,Page 15/42,文本格式标记, 标记 用于以粗体字体显示文本 标记 用于以斜体字体显示文本 标记 为在浏览器中显示的文本添加下划线 标记 使文本的高度低于周围的文本,并以更小的字体进行显示 标记 使文本的高度高于周围的文本,并以更小的字体进行显示,HTML提供多个用于格式化文本内容的标记这些标记定义文本的显示格式。、 标记可用于格式化文本,学习HTML格式标记字符格式化标记 开始认识基本标记 IT技术的发展是科技进步的标志。 我热爱运动、学习、工作。 水的分子式是 H 2 O。 3 2 等于 9。 ,Page 16/42,列表2-1,列表是以逻辑
9、方式对数据进行分组列举列表基本分为:无序列表和有序列表无序列表(项目列表)列表项前面带有项目符号包含在无序列表标记 . 内列表中每项都用列表标记 标记,其中 LI 表示列表项。结束标记 为可选项 有序列表(编号列表)列表项以自动生成的编号顺序显示 有序列表包含在 标记内,学习 HTML最新网络游戏产品星战情缘仙侣奇缘梦幻国度卓越之剑傲世Online龙与地下城盟军敢死队,示例(无序列表):,学习HTML最新网络游戏产品排名星战情缘仙侣奇缘梦幻国度卓越之剑傲世Online龙与地下城盟军敢死队,示例(有序列表):,Page 17/42,列表2-2,可添加属性以定义为列表项生成的编号系统,START,Page 18/42,其它常用标记 8-1,标记 标记用于控制网页上文本的显示此标记包含文本大小、颜色和样式等属性,font标记的用法原创作品区 商业插画作品区精品插画创作 插画CG涂鸦草图练习区CG涂鸦草图练习 插画CG作品完稿区写实风格,使用示例:,Page 19/42,其它常用标记 8-2,Page 20/42,其它常用标记 8-3,