科创学院Wb应用开发课件 第二章 页面的布局及样式设计.ppt

2.2.4 文本类标记 HTML网页可以呈现文字、图像、声音、视频等多媒体内容，因此，HTML标准包含多种标记来规定其呈现样式。 字符的格式化 段落的格式化 1 字符的格式化 (1)font标记 在HTML中，使用字体标记font…/font来设置字体的字符格式，可以通过用字体标记的size、color和face属性来分别设置字体的大小、颜色和种类。 字体大小使用size属性来设置，浏览器将字号分为1~7级，因此可用的值为“1”至“7”； 字体颜色使用color属性来设置，一般使用颜色名称来设置，如red、blue、green等，也可使用十六进制RGB来设置； 字体种类使用face属性来设置，一般使用字体的名称作为参数来设置，如宋体、楷体等。 例 2?6 显示“欢迎光临！”字样，宋体，红色，大小为5。 font size=5 color=red face=宋体欢迎光临!/font 2.2.4 文本类标记 1 字符的格式化 (2)其他字符格式化 例 2?7 对字符进行修饰。 html head title设置字符修饰的样式/title /head body b加粗的文字/bbr/ i斜体的文字/ibr/ u带下划线的文字/ubr/ 解下面的方程：br Xsup2/sup-5X+4=0br/ Xsub1 /sub=1；Xsub2 /sub=4br/ /body /html 2.2.4 文本类标记  2 段落的格式化 例 2?8 设置段落的格式 html head title设置段落的格式/title /head body h1 align=center《游子吟》/h1 p align=center 作者：孟郊 /p hr width=100% size=2 color=#00eeff p align=center font face=宋体 color=#ffff00 size=5慈母手中线，br/游子身上衣。br//font /p /body /html 2.2.4 文本类标记 2.2.5 图像标记 img标记的常用属性有： src：用来设定图像文件的路径，可以使用绝对路径、相对路径或根路径。 alt：用来给出图像的简单文本说明，这段文本在浏览器不能显示图像时显示出来，或图像加载时间过长时先显示出来。 width、 height：用来设定图像的宽度和高度，属性值为整数，单位是“px”（像素）或“%”（百分比）。 border：用来设定图像的边框宽度，属性值为整数，单位为像素。 例 2?9 img标记的使用 修改例 2?8网页，在h1标记前加入如下元素： img src=YouZiYin.jpg alt=游子吟 height=200px width=300px/ 2.2.6 对象标记 object标记，即对象标记，用于在Web页面中嵌入一个对象，最常见的对象是flash对象，可用来播放flash动画，Windows Media Player对象或者Real Player对象也很常见，可用于播放多媒体文件。客户端必须已经安装好对应的播放器插件，对象标记才能正常工作，浏览器仅负责根据对象标记调用相关插件。 object标记的特有属性有： classid：包含对象类的唯一标识。 codebase：指示到何处下载此对象。 不同的播放器插件对象，有不同的控制参数，object标记是一个复合标记，包含param子标记，用来定义特定对象的控制参数，一个param子标记包含一个名值对参数。 2.2.6 对象标记 例2?10 使用object标记播放flash动画。 object classid=clsid:d27cdb6e-ae6d-11cf-96b8-0000 width=100 height=100 codebase=/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0 param name=movie value=moviename.swf param name=play value=true param name=loop value=true param name=quality value=high embed src=moviename.swf width=100 height=100 play=true” loop=true quality=high pluginspage=/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash /embed /object 2.2.7 移动对象标记