您好，欢迎访问三七文档
当前位置：首页 > 商业/管理/HR > 信息化管理 > Web应用程序设计第2章x
第2章HTML网页设计（时间：2次课，4学时）第2章HTML网页设计HTML是一种超文本标记语言，是进行网页设计的基础，本章介绍HTML的基础知识及网页设计的基本技术。重点掌握：文本网页的设计及布局网页加入图像在网页中使用列表创建超文本链接创建表格多窗口网页输入表单声音和动画第2章HTML网页设计2.1网页的文本及布局2.2主页加入图像2.3在主页中使用列表2.4创建超文本链接2.5表格2.6多窗口网页2.7输入表单2.8多媒体技术网页的文本及布局2.1.1标题和流动字幕2.1.2网页的背景色和背景图像2.1.3文本及颜色2.1.4换行与分段2.1.5布局标题和流动字幕1．标题标题是一篇文章或一段文本的题目，是以某种方式被加强、被突出的词组或短语。在网页设计中，使用Hn标记设定标题，格式为：Hn标题/HnHn标记是一个双标记。标记中的n的值可取1-6的整数值，1时文字最大，依次取6时文字最小，缺省时为H6。这样，共有6级标题可供在网页设计中建立页面内容的分级结构。。2.流动字幕网页上在设置流动字幕可使得网页更加生动活泼，并有动态感觉。使用标记MARQUEE和/MARQUEE可以实现流动字幕。格式为：MARQUEE文本/MARQUEEMARQUEE标记的属性及其意义如下：(1)align=top或middle或bottom设定marquee和文本的垂直对齐(2)bgcolor=颜色设定marquee的背景色(3)width=x或x%设定marquee的高，x为像素数或相对与窗宽的百分数。(4)direction=left或right设定文字从右向左流或从左向右流(5)height=x设定marquee的高，x为像素数(6)loop=-x、-1或Infinite设定循环次数。-1或infinite时无限循环(7)behavior=scroll文字单向流动(8)behavior=side流动文字到达边界停止(9)behavior=alternate流动文字到达边界后反向流动【例2-1】MARQUEE标记的用法例代码设计例子：CENTERMARQUEEbgcolor=#00ff00width=80%behavior=alternateloop=-1fontsize=6color=#ff0000欢迎到软件学院学习/font/MARQUEE/CENTER在浏览器中的显示结果:网页的背景色和背景图像1．设置网页的背景色在网页设计中，使用标记BODY的属性bgcolor设定网页背景色。格式为：BODYbgcolor=颜色值颜色值可以是英文颜色名或16进制的颜色值，如表2-1所示:。表2-1背景色序号颜色名16进制代码1BLUCK#0000002BLUE#0000FF3BROWN#A52A2A4CYAN#00FFFF5GRAY#8080806GREEN#0080007IVORY#FFFFF08ORANGE#FFA5009PINK#FFC0CB10RED#FF000011WHITE#FFFFFF12YELLOW#FFFF0013CRLMSON#CD061F14GREENYELLOW#90FF1515DODGERBLUE#0B6EFF16LAVENDER#DBDBF8例如，在网页中，使用BODYbgcolor=#00ff00将网页背景色设为绿色。2．设置网页的图像背景使用BODY标记的background属性可以给网页设置背景图像。格式为：BODYbackground=图像文件名.gif图像系指图像文件，可以是.GIF文件、JPEG文件或PNG文件。例如，使用BODYbackground=photo_6.gif将文件名为photo_6.gif的图像设置为网页的背景图像。文本及颜色1．设置一段文字的大小及颜色（1）FONT标记使用FONT标记设定一段文章、一个语句、一个单词或多个单词的文字大小。格式为：FONTsize=数值文字/FONTFONT标记size属性的数值范围为1～7，与Hn标记中n的取值范围稍大一些，字的大小也差不多。但是，size取7时最大，1时最小。FONTsize=7比H1稍大。在编辑文本的过程中，使用FONT标记的color属性可以变化某一字或某一字段颜色。格式为：FONTcolor=颜色字或字段/FONT其中颜色使用表2-1中的值。例如：FONTcolor=#ffffff文字段颜色为白色。/FONT或FONTcolor=red文字段颜色为红色。/FONT【例2-2】FONT标记的用法代码设计例子：htmlbody FONTsize=2张光明教授，男，河北省石家庄市人/FONT。FONTsize=6color=#0000ff1980年由国家公派到美国加里佛尼亚大学攻读博士学位/FONT，1988年回国。FONTsize=7现任南天科技大学软件学院教授/FONT。/body/html://2．整个网页文本颜色在BODY标记中使用text属性设定整个网页文字的颜色，格式为：BODYtext=颜色html文件中text属性的用法例子如下：BODYtext=#ff00003.特殊标识在网页上显示一些特殊符号需使用特殊标识，常用特殊标识如下：用用>&用&“用"例如：<HEAD>br<TITLE>图象背景</TITLE>br</HEAD>fontsize=4color=redbr<BODYbackground=photo_6.gif>/fontbr<FONTsize=4color=#ff00ff>张光明教授</FONT>br</BODY>br</HTML>浏览器显示如下：://换行与分段文章的行间调整使用三个标记:即BR、p和HR标记。1．强制改行强制改行使用标记BR，位于文章一行的末尾，无结束标记。它强制文本换行。格式为:BR2．段落段落标记P用于分段，其位置在文章前段的末尾，并使前段与后段之间留一行空白。段落标记P可省掉结束标记。3.标尺线标尺线标记HR也是一个用于分段的标记，它在前后两个段落之间定义一条标尺线。在HR标记中使用属性width可以变化标尺线的长度。格式为:HRwidth=x或HRwidth=x%x为象素数，表示标尺线的长度。用%指定时表示线长占屏幕宽度的百分数。在设定标尺线的长度的同时，使用属性size可设定标尺线的宽度。格式为:HRwidth=xsize=yy为象素数，表示线的宽度。另外，使用noshade属性可将标尺线设置为黑色，线的尺寸设定与上相同。标尺线的位置可由align属性指定。格式为:HRalign=right右对齐HRalign=leftt左对齐HRalign=center居中该属性缺省时居中。标尺线着色是InternetExplorer的扩展，在标尺线标记HR内使用COLOR属性可以使标尺线着色。格式为；HRCOLOR=颜色【例2-4】设定标尺线代码设计例子及浏览器下示如下。H1align=center软件学院教授简介/H1HRsize=4color=#ff00ffH3张光明教授/H3P4.预置格式在网页设计中，有时希望浏览器上照原样显示预先排好的一段文本，这时可使用HTML的预置文本功能。预置文本时使用PRE标记。格式为：PRE段落格式/PRE代码设计例子及浏览器下示如下。代码设计例子：PREH3B学术研究方向/B/H31.计算机图形学及计算机辅助设计2.计算机图网络及计算机通信H3B学术研究成果/B/H31.完成国家攻关研究4项，其中两项获Ahref=zhang3.html科学技术进步奖/A。2.在国际学术刊物发表Ahref=zhang1.html论文9篇/A；出版Ahref=zhang2.html著作/A4部。/PRE布局文本块（和图像）在网页上的布局通常有三种方式，对中、左对齐和右对齐，所使用的标记说明如下。1．居中在布局上使文本块（或图像）居中的标记及其格式如下：(1)使用P标记和align属性的center值。格式为：Palign=center文本或图像/P则文本和图像居中排。(2)使用CENTER标记。格式为：CENTER文本或图像/CENTER(3)使用Hn标记和align属性的center值。格式为：Hnalign=center文本或图像/Hn(n=1,2,3,4,5,6)2．左对齐(1)使用P标记和align属性的right值。格式为：Palign=right文本或图像/P(2)使用Hn标记和align属性的right值。格式为：Hnalign=right文本或图像/Hn(n=1,2,3,4,5,6)3．右对齐(1)使用P标记和align属性的left值。格式为：Palign=left文本或图像/P(2)使用Hn标记和align属性的left值。格式为：Hnalign=left文本或图像/Hn(n=1,2,3,4,5,6)．2网页加入图像2.2主页加入图像2.2.1主页加入图
三七文档所有资源均是用户自行上传分享，仅供网友学习交流，未经上传用户书面授权，请勿作他用。
扫描二维码
huyong717
本文标题：Web应用程序设计第2章x
链接地址：https://www.777doc.com/doc-3369578 .html