HTML基础教程2.ppt

HTML第二讲 文字标签属性 1 文字属性标记1 文字颜色指定颜色 RRGGBB16进制数码例 01 htm 文字标签属性 2 文字属性标记2 文字字体 客户端可获得的字体02 htm 文字标签属性 3 文字属性标记3 文字大小 1 2 3 4 5 6 7or 例 03 htm 文字标签属性 4 文字属性标记4 文字标题 1 2 3 4 5 6例 04 htm 文字布局 行的控制段 Paragraph 可以看作是空行 空白占位符例 05 htm 文字布局 行的控制HTML的段落与段落之间有一定的空隔 如果不希望出现空隔而只想换行的话 就要用到另一个元素 即元素 元素可以使所在的位置出现换行 这种换行和浏览器的自动换行的效果类似 元素不是成对出现的 例 06 htm不换行07 htm HTML文字与段落格式控制 倾斜文本粗体文本下划线文本删除线文本 例 08 htm 09 htm 10 htm 11 htm 综合练习 基本组成部分 HTML注释 HTML文档可以插入注释 注释内容不会在浏览器窗口显示HTML注释的格式为 例 12 htm 文字的对齐 n 1 2 3 4 5 6 left center right 例 13 htm 文字的分区显示 left center right 例 14 htm 3 HTML段落与分行控制 居中 元素元素是一个独立的使所标记的字符居中的元素 它的作用与使用元素里的align center 类似例如 居中段落15 htm 3 HTML段落与分行控制 标尺线 设定线宽 设定线长 设定对齐方式 left right 设定线的颜色例 16 htm 3 HTML的段落与分行控制 无序列表元素 1列表在HTML的文档里有重要的地位 HTML规定了多种列表元素 列表所起的主要作用是使特定的文本有序化 3 HTML的段落与分行控制 无序列表元素 2无序列表是由和元素定义的 sportsfooddrinkfriends例 17 htm 3 HTML的段落与分行控制 无序列表元素 3无序列表的默认符号是圆点 元素有type属性 通过定义不同的type属性可以改变列表的项目符号 目前 type属性的属性值有 disc 圆 circle 圆圈 square 方块 例 18 htm 3 HTML的段落与分行控制 有序列表元素 1有序列表由和定义 sportsdrinkfriends例 17 htm 3 HTML的段落与分行控制 有序列表元素 2元素也有自己的type属性 type属性的属性值有1 A a I i等 例如 我们以A B C 作为列表的编号例 19 htm元素还可以定义列表的起始编号 如我们希望列表的第一个编号为5 而不是1 则需要定义元素的start属性例 20 htm 4 超级链接 普通超级链接1 超级链接是整个WWW应用的核心和基础 如果没有超级链接的概念 那么 我们现在所有的WWW的应用将不复存在 所以 对超级链接的掌握具有特殊重要的意义 4 超级链接 普通超级链接2 超级链接是用锚元素定义的在元素下 有元素属性href href的属性值为一个URL地址如 指向学院的超级链接如 普通超级链接例 21 htm 4 超级链接 E mail超级链接 超级链接可以指向E mail地址如 指向E mail地址的超级链接例 22 htm 4 超级链接 新开链接窗口 开一个新的 浏览器 窗口 TargetWindow 例 26 htm 4 超级链接 去除下划线 去掉超级连接的下划线 style text decoration none 例 25 htm 4 超级链接 其他超级链接 WWW应用仅仅是Internet应用的一种 Internet还有其他很多应用 如 Ftp等 实际上mailto也属于非WWW应用 我们可以类似的创建指向Ftp等的超级链接 指向其他Internet应用的超级链接不是我们掌握的重点 4 超级链接 锚点 书签 1 指向本页面锚点aa的超级链接例 23 htm指向23页面的锚点top的超级链接例 24 htm 练习 手写代码实现 链接 新开窗口与Email 背景 文字颜色 字体 换行 页面标题 练习 27 htm HTML对图片的控制 1 基本语法 引用图片必须用元素标志 元素下的基本元素属性是src属性 src的属性值为所引用的图片的URL地址 src属性是必须的 Src的URL可以是绝对地址 也可以是相对地址例 28 htm HTML对图片的控制 2 所谓图片的替代文本 指图片不能显示时在图片所在位置显示的一段文本或当鼠标移到图片上时也会显示替代文本 定义图片替代文本的方法是 例 28 htm HTML对图片的控制 3 图片的显示大小我们可以指定一幅图片在浏览器窗口里的显示大小 定义图片的显示大小的方法是 width指定图片的宽度 height指定高度 它们的属性值可以是象素 也可以是 例 29 htm HTML对图片的控制 4 图片的边框我们可以为一幅图片加一个边框以突出显示 border的属性值为象素数例 30 htm HTML对图片的控制 5 图片的对齐方式图片可以相对于页面或单元格有一个对齐方式 定义水平对齐方式的方法是 例 31 htm HTML对图片的控制 6 图片的对齐方式定义图片的垂直对齐方式 对于图片的对齐方式不仅是以上几种 但是以上的几种是最常用的 例 32 htm HTML对图片的控制 7 定义图片与左 右的文本之间的间距图片在显示时 与左右的文本之间可以有一定的间距Hspace horizontal 定义水平间距 Vspace vertical 定义垂直间距 单位都是象素数 例 33 htm HTML对图片的控制 8 图象的超级链接图象的超级链接是指整个图象的超级链接 当点击图象的任何部分时 都会打开这个超级链接 定义默认超级链接的方法是 所以 所谓超级链接实际上就是用元素标志一个图象的引用 例 34 htm HTML对图片的控制 9 图象映射所谓图象映射是指一个图片上的不同位置被指定了不同的超级链接 点击图片的不同位置会打开不同的超级链接目标 这与前面的默认超级链把整个图片作为超级链接的元素是很不一样的 HTML对图片的控制 10 图象映射 只要求理解标记含义 图象映射由定义 有一个基本属性是name Name给图