云南大学网页设计期末复习重点Word文档格式.docx
- 文档编号:8421201
- 上传时间:2023-05-11
- 格式:DOCX
- 页数:14
- 大小:44.78KB
云南大学网页设计期末复习重点Word文档格式.docx
《云南大学网页设计期末复习重点Word文档格式.docx》由会员分享,可在线阅读,更多相关《云南大学网页设计期末复习重点Word文档格式.docx(14页珍藏版)》请在冰点文库上搜索。
,<
p>
,又有控制表现的标签,例如<
font>
b>
,还有本意用于结构后来被滥用于控制表现的标签,例如:
<
h1>
table>
等。
结构标签与表现标签混杂在一起。
造成改版和数据利用的困难。
(3)HTML是由非常不严格的建议标准管理,导致代码编写过程中,程序设计师会撰写出不好的程序代码,当程序需要纠错时很难找到出错的位置。
2.XHTML
(1)定义:
XHTML是结合了部分XML强大功能以及大多数HTML简单结构的综合体。
XHTML是一种增强了的HTML,XHTML的标签只用来定义文档的结构,所有涉及表现的东西通通剥离出来,把它放到一个单独的文件里,这个单独的文件就是CSS。
(2)现状:
成为国际上备受推崇的Web设计标准。
在各种网页设计工具中,默认创建的网页文档虽仍然以HTML为文档的扩展名,事实上都是以XHTML编写的。
(3)XHTML的基本结构:
声明、根元素、头部元素、主体元素
3.XHTML的代码规范【简答】
(1)所有的标记都必须要有一个相应的结束标记
(2)所有标记的名称和属性的名字都必须使用小写
(3)所有的标记都必须合理嵌套
(4)所有属性必须用引号括起来
(5)把所有“<
”、“>
”和“&
”特殊符号用编码表示
(6)给所有属性赋一个值
(7)不要在注释内容中使“--”
4.基本标记及其属性。
XHTML文档由标记和被标记的内容组成。
所有的标记必须有结束符这句话是正确的。
(1)标记
A.定义:
标记(tag)能产生所需的各种效果。
其功能是将网页的内容排成理想的效果。
B.书写规则:
a.每个标记都要用“<
”和“>
”括起来,“<
”与标记名之间不能留有空格或其他字符
b.有些标记不是成对的,称为单标记
c.在标记名前加上符号“/”便是其结束标记,表示该标记的结束,如<
h1/>
(2)属性
A.标记与属性的不同
标记规定的是信息的类型,属性规定的是信息显示的效果。
B.格式
标记属性1="
属性值1"
属性2="
属性值2"
…>
受标记影响的内容<
/标记>
如<
h1align=“center”>
欢迎访问主页<
/h1>
C.要点
a.不是所有的标记都有属性,如换行标记就没有。
b.可以根据需要使用记标记的几个属性,在使用的属性之间顺序无先后之分。
c.属性名和标记名都必须用小写字母表示,属性值都要用双引号括起来。
3.URL
(1)格式:
通信协议:
//链接地址/文件位置/……/文件名称
(1)绝对位置:
http:
//
(2)相对位置:
同一、上级、下级、同级
【重点】常用的标签及代码解析
整体设计
1.XHTML常用
(1)文档标记<
html>
…<
/html>
(2)文档头标记<
head>
/head>
(3)文档标题标记<
/title>
显示在浏览器的标题栏
(4)文档主体标记<
body>
/body>
常见格式:
!
DOCTYPEhtmlPUBLIC"
-//W3C//DTDXHTML1.0Transitional//EN"
"
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
htmlxmlns="
//www.w3.org/1999/xhtml"
metahttp-equiv="
Content-Type"
content="
text/html;
charset=utf-8"
/>
无标题文档<
2.注释标记:
----注释内容---->
3.强制换行符:
/br>
;
强制不换行符<
nobr>
文字<
/nobr>
4.段落标记:
/p>
palign=”对齐方式”>
(2)效果:
使后面的文字换到下一行;
两段之间多出一空行。
5.水平线标记
hralign="
left|center|right"
size="
横线粗细"
width="
横线长度"
color="
横线颜色"
noshade="
noshade"
size:
设定线条粗细,以像素为单位,默认值为2.
width:
设定线条长度,以像素或当前窗口的百分比为单位。
默认值为100%,即为填满窗口。
文字格式
1.标题文字格式<
h#>
标题<
/h#>
h#align=”对齐方式”>
标题文字<
a.选择#将显示标题文字大小,#取值范围为1-6,1时字体最大,6的字体最小。
b.选择align=left/center/right会设置标题的位置。
c.自动换行效果
(3)区分:
h>
与<
标签显示的内容在浏览器的窗口中,<
显示的内容爱浏览器的标题栏中。
2.设置文字大小
fontsize=”数字”face=”字体名”color=”颜色”>
被设置的文字<
/font>
a.size选择文字的大小,取值范围1-7,1时字体最小,7时字体最大。
b.face:
设置文字的字体。
c.color设置字体的颜色
标记
对象
用法
文字#的取值
字体加粗
一段文章、语言、短语
fontsize=…>
1-7max=7
不自动加粗
标题
1-6max=1
注意:
当<
取值中的size取7的时候的文字比<
大。
3.设置文字的颜色
(1)<
标记中的text属性
格式:
bodytext=”颜色”>
效果:
对整个文件起作用,设置整个网页的文字颜色。
(2)<
标记中的color属性
fontcolor=”颜色”>
作用于之后的文字。
同时对文字颜色进行定义时,<
标签优先。
就近原则。
超链接
1.
(1)定义:
超链接(Hyperlink)是网页互相联系的桥梁,超链接可以看作是一个“热点”,它可以从当前网页定义的位置跳转到其他位置,包括当前页的某个位置、Internet或本地硬盘或局域网上的其他文件,甚至跳转到声音、图片等多媒体文件。
(2)通过超链接我们可以获取的服务类型有文件传输、资料查询、电子邮件、远程访问等。
2.锚点标记<
a>
..<
/a>
(1)格式<
ahref="
地址"
id="
锚点名称"
target="
打开窗口方式"
超链接显示文本<
(2)注意
A.href属性为超文本引用,它的值为一个URL,是目标资源的有效地址。
如果要创建一个不链接到其它位置的空链接,可用“#”代替URL,即<
ahref="
#"
>热点<
b.target属性设定超级链接被单击后所打开窗口的方式,可选值为:
_blank,_parent,_self和_top。
C.<
中不能包含其他<
,即自己不能嵌套。
3.指向其他页面的链接
(1)链接到同一目录内的网页文件
目标文件名.html"
(2)链接到下一级目录的网页文件
子目录名/目标文件名.html"
(3)链接到上一级目录中的网页文件
../目标文件名.html"
其中“../表示退到上一级目录中。
(4)链接到同级目录中的网页文件
../子目录名/目标文件名.html"
4.指向本页中的链接
要在当前页面实现超链接,需要定义两个标记:
一个为超链接标记,另一个为标签标记。
(1)超链接标记格式:
ahref=”#记号名”>
热点文本<
(2)书签格式:
aid/name=”记号名”>
目标附近的字符串<
5.指向下载文件的链接
ahref=”可下载文件名”>
6.指向电子邮件的链接
ahref=mailto:
电子邮件地址>
图像
1.设置图像标记<
img>
imgsrc="
图像文件名"
alt="
替换文本"
图片宽度"
height="
图片高度"
border="
边框宽度"
hspace="
水平方向空白"
vspace="
垂直方向空白"
align="
环绕方式|对齐方式"
A.src的格式:
图像文件的路径/图像文件名
B.hspace横向间隙vspace竖向间隙。
C.align:
left图像居左,文本在图像的右边;
top文本与图像在顶部对齐;
middle文本与图像在中央对齐;
bottom文本与图像在底部对齐。
2.设置网页的背景
(1)设置背景色<
bodybgcolor=”色彩值”>
(2)用图片作为背景<
bodybackground=”图像文件名”>
3.用图片作为超链接
ahref=”URL”>
imgsrc=”图像文件名”/>
4.设置音频与视频
(1)加入背景音乐:
bgsoundsrc=”声音文件名”loop=”播放次数”>
(2)加入视频剪辑:
imgsrc=”图像文件”dynsrc=”视频剪辑文件.avi”loop=”次数”loopdelay=”时间”start=”播放开始时间”controls>
其他标记
1.列表
(1)列表分为有序列表与无序列表。
(2)无序列表
格式:
ultype=#>
li>
第一个列表项<
/li>
第二个列表项<
…
/ul>
说明:
A.<
ul>
用来定义一个无序列表,<
定义列表项。
B.type的类型
type=disc(实心圆)/circle(空心圆)/square(方框)
(2)有序列表:
使用<
ol>
建立有序列表
oltype=#start=n>
/ol>
type=a/A/i/1
A.整个表项与上下段文本间各有一行空白
B.表项会向右缩进,每行前面有序号。
2.表格
(1)作用:
(2)最简单的表格仅包括行与列。
表格的标记为<
行标记为<
tr>
表项格式为<
td>
(3)格式:
tableborder="
n"
x|x%"
y|y%"
cellspacing="
i"
cellpadding="
j"
align=”left/right/top/bottom”>
captionalign=”left/right/top/bottom”valign=”top/bottm”>
/caption>
th>
表头1<
/th>
表头2<
表头n<
/tr>
表项1<
/td>
表项2<
表项n<
…
/table>
A.表格内文字的水平对齐有<
的align的属性实现,有center/left/right/justify四种方式。
垂直对齐由标记<
中的valign属性实现,有top/bottom/middle/baseline四种方式。
B.表格在浏览器中的对齐由<
中的align属性实现。
3.表单
form>
formname="
表单名"
action="
URL"
method="
get|post"
inputtype="
表项类型"
name="
表项名"
value="
缺省值"
x"
maxlength="
y"
/form>
method的属性get是获得表单,post是发送表单。
方向为服务端到客户端
input>
type的类型有text(文字)、textarea(多行文本框)、password(密码框)、radio(单选框)、checkbox(复选框)、file(文件框)、submit(提交按钮)、reset(重置按钮)、button(普通按钮)
(3)<
select>
当浏览者选择的项目较多时,用户可以用<
和<
option>
标记来设置选择栏。
selectsize=”x”name=”控制操作名”multiple>
optionselectvalue=”可选择的内容”>
/option>
/select>
selecte="
selected"
,加上本项表示该项是预置的
(4)<
textarea>
标记:
多行文字输入。
第三章AdobeDreamweaverCS3入门知识
网站包括本地网站和远程网站,站点有远程站点和本地站点两种创建形式。
第四章网页元素
1.路径包括绝对路径和相对路径。
(1)绝对路径:
提供链接文档的完整URL,而且包括所使用的协议,如;
还有本地绝对路径
(2)相对路径包括文档相对路径和站点根目录相对路径
3.超级链接
href=”URL”target=”_blank/_parent/_self/_top”>
(2)说明
_blank:
将链接的文档载入一个新的、未命名的浏览器窗口。
_parent:
将链接的文档载入该链接所在框架的父框架或父窗口。
如果包含链接的框架不是嵌套框架,则所链接的文档载入整个浏览器窗口。
_self:
将链接的文档载入链接所在的同一框架或窗口。
_top:
将链接的文档载入整个浏览器窗口,从而删除所有框架
(3)创建超连接的方法【简答】
A.在文档窗口中选中需要建立超链接的文本或图像
B.单击“链接”文本框右侧的文件夹图标,以通过浏览选择一个文件。
在URL文本框中显示了被链接的文档的路径。
C.从“目标”弹出菜单中,选择文档打开的位置。
在弹出菜单中选择一个选项
(4)超链接的类别有:
外部链接、内部链接、锚记链接、E-mail链接、空链接、脚本链接
第六章使用CSS创建页面
1.CSS的基本内容
层叠样式表(CascadingStyleSheets,CSS)是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言,是一系列格式设置规则,使用CSS可以非常灵活地控制页面的外观,从精确的布局定位到特定的字体和样式等。
(2)特点:
内容与表现形式是相互分开的
(3)功能:
使用CSS可以控制许多文本属性,包括特定字体和字大小;
粗体、斜体、下划线和文本阴影;
文本颜色和背景颜色;
链接颜色和链接下划线等。
除设置文本格式外,还可以使用CSS控制Web页面中块级别元素的格式和定位。
2.CSS样式的规则和类型
(1)CSS格式设置规则由两部分组成:
选择器和声明。
(2)类型:
【简答】创建类(自定义样式)、重定义标签、使用标签选择器。
A.自定义CSS规则
B.HTML标签规则重定义特定标签(如p或h1)的样式
C.CSS选择器规则(高级样式)重定义特定元素组合(如a:
link、a:
visited、a:
hover和a:
active)的格式,或其它CSS允许的选择器形式的格式。
3.链接外部样式使用<
link>
charset=gb2312"
外部样式<
linkhref=“style/localstyle.css”rel=“stylesheet”type=”text/css”/>
--链接CSS文件-->
4.创建css样式
(1)将插入点放在文档中,选择主菜单【窗口】/【CSS样式】命令,或者按“Shift+F11”键,或者单击“属性”面板中的“CSS”按钮。
打开CSS样式面板,如图所示“列表”视图
(2)单击面板右下角区域中的“新建CSS规则”按钮()。
显示出“新建CSS规则”对话框
(3)定义要创建的CSS样式的类型:
“创建类(自定义样式)”、“重定义标签”、“使用标签选择器”,然后命名或者选择标签。
(4)选择定义样式的位置:
若要创建外部样式表,选择“新建样式表文件”。
若要在当前文档中嵌入样式,选择“仅对该文档”,单击“确定”按钮。
(5)随即出现“CSS样式规则定义”对话框,在对话框中设定样式外观。
选择要为新CSS样式设置的样式选项。
设置完样式属性后,单击“确定”按钮。
(6)应用样式。
对于标签样式和CSS选择器,样式是自动应用于网页的。
对于自定义样式,需要特别设定应用范围。
5.AP元素
AP元素即绝对定位元素,与以前版本的“层”的概念是对应的,是分配有绝对位置的HTML页面元素,具体地说就是div标签或其它任何标签。
AP元素可以包含文本、图像或其它任何可放置到HTML文档正文中的内容。
定位网页元素
(3)功能
A.AP元素可以放置在网页的任意位置,用户可以将文本图像等元素放到层中,这样网页元素就可以移动到网页的任意位置。
B.AP元素可以控制网页元素的显示顺序,也能控制网页元素的显示或隐藏,还可以移动,以产生动态效果。
第七章应用行为
1.行为
行为是事件和由该事件触发的动作的组合。
(2)事件的定义:
事件是触发动态效果的条件,是浏览器生成的信息,指示该网页的访问者执行了某种操作。
(3)动作的定义:
动作是由预先编写的JavaScript代码组成的,这些代码最终产生动态效果。
(4)三者的关系:
对象在发生设定事件的情况下,产生相应动作。
2.更改行为
(1)编辑动作的参数,双击该行为名称或将其选中并按“Enter”键;
然后更改对话框中的参数并单击“确定”按钮。
(2)更改给定事件的多个动作的顺序,选择某个动作然后单击上下箭头按钮。
或者选择该动作然后剪切它,并将它粘贴到其它动作中所需的位置。
(3)删除某个行为,请将其选中然后单击减号(-)按钮或按“Delete”键
第八章应用模板
1.在Dreamweaver中共有四种类型的模板区域:
可编辑区域、重复区域、可选区域、可编辑标签属性。
2.模板
一个可供参考的网页
设定可编辑部分不可编辑部分。
第九章网页动画制作工具Flash基础
1.帧
帧是构成动画作品的基本单位,它装载了Flash播放的内容。
(2)类别:
关键帧、空白关键帧、过渡帧
2.层
Flash中层就像一张“透明纸”
普通层、运动引导层、遮罩层和注释说明层
3.对象:
在Flash中任何被选中的东西,都可以叫做对象。
4.元件:
元件也被称作符号或图符,是指一次创建即可重复使用的元素,元件的类型可分为图形、按钮或动画(影片剪辑)(放在库中反复使用)。
5.实例:
实例是指位于舞台上或嵌套在另一个元件内的元件副本(正在使用的元件)
6.从制作原理上,动画分为逐帧动画和补间动画。
(1)逐帧动画:
每一帧都是关键帧
(2)补间动画包括形状补间和
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 云南大学 网页 设计 期末 复习 重点