HTML中文字的使用课件

1、 例2：空格和换行的显示文字的空格、回车等使用子曰:“学而时习之，不亦说乎？有朋自远方来，不亦乐乎？ 人不知而不愠，不亦君子乎？”说明： :空格符号，输入显示一个空格:换行标记，将文字换行显示，是一个单个使用的标记，效果同 按“Enter”键第1页，共41页。 P标记换行文字的空格、回车等使用子曰:“学而时习之，不亦说乎？有朋自远方来，不亦乐乎？人不知而不愠，不亦君子乎？”说明：；段落标记，除同一样换行外，还用一空白行间隔，效果如同按连续按两下“Enter”。标记也可单独使用,但不建议用第2页，共41页。 例3:文字单行显示强制不换行子曰:“学而时习之，不亦说乎？有朋自远方来，不亦乐乎

2、？人不知而不愠，不亦君子乎？”子曰:“学而时习之，不亦说乎？有朋自远方来，不亦乐乎？人不知而不愠，不亦君子乎？”第3页，共41页。 说明:默认情况下,文字随浏览器窗口大小变化换行显示,采用标记,不管窗口大小如何变动,文字都以一行显示但在标记中插入成对的标记之间的内容会被强制换行！第4页，共41页。 例4:文字居中显示居中显示凉州曲 王翰葡萄美酒夜光杯，欲饮琵琶马上催。醉卧沙场君莫笑，古来征战几人回。说明:居中标记作用是将文字以居中对齐方式显示第5页，共41页。 例5:文字段落的缩进文字的缩进凉州曲 王翰葡萄美酒夜光杯，欲饮琵琶马上催。醉卧沙场君莫笑，古来征战几人回。第6页，共41页。 说明:右

3、缩进标记,将某段文字向右缩进方式显示,同时用空白行间隔.注意:不能与标记嵌套使用第7页，共41页。 标记属性的应用例1:段落位置的控制段落对齐方式居中段落靠左段落靠右段落说明:align属性名,控制文字的显示位置,”center”、”left”、”right”为属性的属性值第8页，共41页。 一般来讲，html的标记有下列三种表示方法：1)文件或超文本2)文本成超文本3)第三种写法仅用于一些特殊的标记,比如分段标记P，它仅仅通知www浏览器在此处分段，因而不需要界定作用范围， 所以它没有结尾链接签。 第9页，共41页。 另外：大多数HTML标记中都可以加入属性控制，其作用是帮HTML标记进一步

4、控制HTML文件的内容，一个标记可以有多个属性，属性及其属性值不分大小写 格式：多个属性间用空格隔开,不同的标记可以使用相同的属性第10页，共41页。 例2:标题文字的位置控制多标记同一属性这些是标题居中标题1靠左标题2靠右标题3第11页，共41页。 例3:设置网页的背景主体标记的属性小孩与大人说明:background控制网页背景图片,属性值为图片路径与图片名第12页，共41页。 标志中还可以有以下属性： 属性用途示例设置背景颜色。红色背景设置文本颜色。蓝色文本设置链接颜色。链接为蓝色设置已使用的链接的颜色。设置正在被击中的链接的颜色。 说明:以上各个属性可以结合使用，如。引号内的rrggb

5、b是用六个十六进制数表示的RGB(即红、绿、蓝三色的组合)颜色，如#ff0000对应的是红色。此外，还可以使用Html语言所给定的常量名来表示颜色： Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, Green, Purple, Silver, Yellow, Aqua ，如表示标志对中的文本使用蓝色显示在浏览器的框内。第13页，共41页。 例4: 水平分割线的设置水平分割线秋歌曾子曰：慎终，追远，民德归矣。第14页，共41页。 说明:水平分割线,单个使用,用来在网页上画出一条水平线,用以分割不同的文字或其它网页

6、组件：可设置水平线粗细, #为数字,以像素为单位：设置水平线宽度，像素或百分比 #=left, right,center：对齐方式:设置为实心线条：设置水平线颜色Noshade:不显示水平线的立体阴影第15页，共41页。 例5:noshade属性的使用 水平分割线第16页，共41页。水平线属性：size: 设置水平分隔线的高度，单位：像素默认值是2width: 设置水平分隔线的宽度， 单位：像素 % 默认值是100%align: 设置水平分隔线的对齐方式。 默认值是center 还有left rightcolor: 设置水平分隔线的颜色。 默认值是blacknoshade: 取消水平线的3d阴

7、影 -第17页，共41页。 例6:属性的就近原则就近显示观察文字颜色观察文字颜色说明:当出现两个属性同时控制网页中相同的组件时,组件离哪个标记近,就由哪个标记的属性控制第18页，共41页。 2.2 多种多样的网页文字文字字体、颜色的设置字体的大小、颜色凉州曲王翰葡萄美酒夜光杯，欲饮琵琶马上催。醉卧沙场君莫笑，古来征战几人回。第19页，共41页。 说明； . #=字体名 . #=Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green, Purple, Silver, Yellow, Aqua .

8、 设置字体大小 #=1, 2, 3, 4, 5, 6, 7 or +#, -#第20页，共41页。 物理字体(Physical Style)粗体 斜体下划线打字机风格字体上标 下标文字中间画线文字中间画线逻辑字体(Logical Style) 强调的文本 加重的文本 编码的字体 引用的文本 小号字体 大号字体第21页，共41页。 2.3 特殊字符的显示专业符号 为段落标记& 为空字符 说明: 特殊字符“”代表符号“” 代表符号”,“&”代表符号”&” ,这些字符都以“&”开头,以分号”;”结尾第22页，共41页。 上下标标记的使用如要在网页中显示:(6 3 + 3 6) 2 1 = ?结果以

9、表示。 H 2 + O 2 H 2 OHTML代码:运算式(6 3 + 3 6) 2 1 = ?结果以 表示。H 2 + O 2 H 2 O第23页，共41页。 说明:上标标记:下标标记代表符号代表符号代表符号代表”Word中没有该字符”第24页，共41页。 2.3 滚动字幕例1：滚动字幕啦啦啦，我会移动耶！第25页，共41页。例2：文字移动属性的设置 方向 #=left, right滚动字幕啦啦啦，我从右向左移！ 啦啦啦，我从左向右移！ 第26页，共41页。例3：方式 #=scroll, slide, alternate滚动字幕啦啦啦，我一圈一圈绕着走！ 啦啦啦，我只走一次就歇了！ 啦啦啦，

10、我来回走耶！ 第27页，共41页。例4：方式 循环 #=次数；若未指定则循环不止(infinite)滚动字幕啦啦啦，我只走 3 趟哟！ 啦啦啦，我只走 3 趟哟！ 啦啦啦，我只走 3 趟哟！ 第28页，共41页。例5：滚动字幕滚动字幕内容第一行滚动字幕内容第二行滚动字幕内容第三行 第29页，共41页。 说明:滚动标记,控制文字的滚动Align:设置字幕的对齐方式,值可以为left、right、center、top、bottomBgcolor:设置字幕背景颜色,属性值为颜色的英文名称Direction:设置文字滚动方向,值可以为left,right,up,downBehavior:设置文字滚动方

11、式,属性值有3个,scroll表示一端滚到另一端,slide表示从一端快速滑动到另一端且不再重复,alternate表示在两端来回滚动Height:设置字幕宽度,属性值为数值(像素)Width:字幕长度,属性值为数值第30页，共41页。 Hspace:设置字幕左右方向空白区域的宽度,属性值为数值(像素)vspace:设置字幕上下方向空白区域的宽度,属性值为数值(像素)scrolldelay:设置滚动两次之间的延迟时间,属性值为数值,数字越大,延迟时间越长Scrollamount:设定滚动速度,属性值为数值,数字越大,滚动速度越快Loop:用于设定滚动的次数,属性值为数值,-1表示一直滚动下去,

12、直到页面更新第31页，共41页。 2.4 文字列表的使用例1:编号列表1提纲标题大体构思初步设计完善设计开始制作反复修改第32页，共41页。 说明: 编号列表的结构内容一内容二内容三编号列表标记第33页，共41页。 例2:更改序列号样式编号列表2提纲标题大体构思初步设计完善设计开始制作反复修改说明:type属性用于设置序号的样式,如type=1或a或A或I或i(I表示大写罗马数字,i表示小写罗马数字)第34页，共41页。 例3:从特定序列号开始编号的开始顺序提纲标题大体构思初步设计完善设计开始制作反复修改说明:start控制序号的开始位置.其结构为start=n,n为数字或字母第35页，共41页。 例4:非序列提纲 非编号列表新闻标题戴尔将在印度增加2000员工 将其设为开发中心微软XBOX亮相软交会 将要正式登陆中国？中芯国际预计第二季芯片出货量增16-18%惠普联手富士通日立希捷 开发新一代储存硬盘松下发布电池工作12小时笔记本电脑第36页，共41页。 说明:编号列表的结构内容一内容二内容三非编号列表标记,使用同编号列表标记一样第37页，共41页。 例5:更改标号样式非编号列表新闻标题戴尔将在印度增加2000员工 将其设为开发中心微软XBOX亮相软交会 将要正式登陆中国？中芯国际预计第二季芯片出货量增16-18%惠普联手富士通日立