admin 管理员组

文章数量: 887032


2023年12月24日发(作者:冒泡排序例题与答案)

T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

Dreamweaver静态网页Html标记代码汇总

网站相关概念

Internet是一个全球计算机互相网络,WWW是Internet所提供的一种极其重要的服务,即World Wide Web,简称Web;WWW主要以Web为表现形式,或者说,Web是Web页即网页的载体,我们所说的Web页就是指由HTML(超文本标记语言)这种语言编写的一类特殊文件,通常后缀为*.html或*.htm的页面。

Dreamweaver CS基本应用

HTML文档结构:

:静态网页源代码首尾结构标记,代码内呈现网页所有内容

:网页主体部分

:网页头部,包含网页导航栏中的标题和网页不显示的信息

:标签内显示出网页台头的标题名,用于标签之内

:辅助性标签,用于标记之内

:标注网页的作者

:设定搜索关键字

:告诉搜索机器人需要索取的页面,默认全部

:http-equiv属性代替name属性,expires设定网页到期时间

:间隔5秒网页自动刷新,并指向新的URL网址

:表示是一行级别是2号的标题文字,有h1~h6的6级标题可选

:文字处理标签

:预先格式化,以格式化显示标签中的内容结构 

:段落标记,center(居中)、left(左边)、right(右边)


:换行标记,按[shift]+[enter]可实现

粗体:粗体字体标记 斜体:斜体字体标记

上标:上标标记文本格式 下标:下标标记文本格式

    :无序列表开始结束标记
  • :列表项标记,为可选项

      :有序列表开始结束标记,start属性指定列表的起始数字

    1. :有序列表的序列标记,可自定义为数字或字母等


      :水平线标记,可标记水平线的长度、高度、纯色阴影显示、颜色等属性

      :在HTML中插入图像,align属性值:top(头部)、bottom(底部)、middle(居中)、left(居左)、right(居右)

      点击

      :弹出“你好!”信息的行为

      点击

      :弹出图片

      :在网页中插入音频文件

      :滚动文字字幕,方向属性:down向下、up向上、left向左、right向右

      咔咔主页:超级链接标记

      点击:对话框脚本链接

      开心农场外挂下载:文件下载链接

      新闻报道:相对路径链接(锚记)

      HTML特殊字符的字符实体:

      特殊字符

      空格

      元(¥)

      大于(>)

      小于(<)

      引号(““)

      “与“符号(&)

      版权号(©)

      注册商标

      转义码

       ;

      ¥;

      >;

      <;

      ";

      &;

      ©;

      ®;

      售价:¥;68

      if A>;B thenA=A+1

      if A<;B thenA=A+1

      ";是还是不是?";问题的关键是

      William &;Graham去了集市

      示例

      欢 ;迎 ;光 ;临

      第 1 页 共 8 页

      T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

      HTML表格标记:

      cellspacing=”单元格之间间距” cellpadding=”单元格内间距”

      :定义表格的标题(可选)

      :定义表格的一行

      :用来装载单元格数据,它们必须位于标记之间

      链接路径:(链接的类型和目标属性)

      1.链接类型

       外部链接:跳转到站点外其他网站的链接

       内部链接:站点根目录内文档之间的互相链接,也称为相对文档链接

       E-mail链接:实现打开E-mail客户端应用程序进行撰写、发送邮件的工作

       局部链接:在同一文档内部或不同文档之间指定位置的链接

      2.链接目标

       _blank:将打开一个新窗口

       _parent:将在父窗口中打开

       _self:将在当前窗口中打开

       _top:将在上级窗口中打开

      :命名锚记

      插入图像、Flash及其他多媒体对象

      1. 在网页中插入图片和图像占位符

      打开HTML文档,将插入点放在要插入图像的位置,单击插入栏中“常用”面板的“图像”按钮,或选择“插入”的“图像”命令,在弹出的“选择图像源”对话框中选择要插入的图像,确定即可。

      同样,选择插入“图像占位符”,也是如此,在对话框中设置占位符名称、宽度和高度、颜色和替换文本。

      2.图像地图(热区)

      绘制热区:在文档窗口单击选中图像,在属性检查器中显示“地图”选项的文本域中为该热区输入一个名字,如果在同一文档中使用多个地图,必须保证名字的唯一。

      热区绘制工具有3种:

       矩形热点工具

       圆形热点工具

       多边形热点工具

      3.创建轮替图像

      轮替效果是插入鼠标经过图像的功能,利用两个图片实现的轮替显示效果。

      将插入点定位到文档窗口中需要插入轮替图像处,选择“插入”—“交互式图像”—“鼠标经过图像”按钮,在弹出的“插入鼠标经过图像”对话框中设置相应的参数,原始图像、鼠标经过图像和按下时,前往的URL。

      4.创建导航条

      导航条通常在网页中的左侧或上方,网站同一级页面乃至整个网站一般会使用同一个导航条,这样使得整个站点方便导航、风格统一,便于浏览者在个页面之间浏览转换。

      打开HTML文档,选择“插入”—“交互式图像”——“导航条”命令或单击插入栏中的常用的面板上导航条,在弹出的对话框中,点击+添加导航条元件,输入项目名称,插入状态图像和鼠标经过图像以及按下图像(可选),还有替换文本和按下时前往的URL,选择水平插入或垂直插入,选中使用表格复选框,可以将元件装入有表格,便于后面对表格进行格式化以及页面的整体布局。

      注意:一个页面文档内只能有一个导航条!

      5.插入Flash多媒体对象

      媒体就是信息的载体,在计算机系统中,它指组合或两种以上媒体的一种人机交互式信息交流和传播媒体,使用的媒体包括文本基准、图像、声音、动画和电视图像。

      Flash文件的3种格式:

      1) Flash源文件格式

      源文件扩展名为.fla是在Flash环境中创建的,只能在Flash程序中打开的文件格式。

      2) Flash影片文件:

      Flash程序中发布或导出的影片扩展名为.swf,是Flash源文件压缩后的优化媒体格式,可以插入到网页第 2 页 共 8 页

      T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

      并上载到Web上,也可以直接在浏览器或媒体播放软件中播放观看,但是不能在Flash应用程序中进行编辑。

      3) Flash模板文件:

      Flash模板文件的扩展名是.swt,用户可以用它修改和替换Flash影片中的信息。

      插入Flash动画过程:将插入点放在页面中布局表格的单元格内,选择“插入”—“媒体”命令或单击插入栏上“常用”面板上的“Flash”按扭,在弹出的对话框中选择后缀为.swf格式的Flash动画文件,确定即可。

      设置Flash动画属性:单击Flash占位符中Flash动画,此时属性检查器中回

      会显示该动画的各个属性,即可以对Flash影片文件进行属性编辑,可编辑的属性值有:名称、宽和高、文件、源文件、编辑、重设大小、编辑(源文件)、循环、自动播放、垂直边距和水平边距、品质、对齐、比例、参数。

      在“参数”域内输入“wmode”,值设为“transparent”(透明),这样可以把.swf格式动画的背景色去掉,达到透过影片看到布局单元格或网页的背景色的效果;尤其对于应用遮罩技术的Flash影片,在要显示影片特殊形状轮廓的情况下,此项“wmode”参数的设置就显得十分有用,浏览器中完成参数设置后的影片和布局表格的背景浑然一体,和修改前的背景效果差别很大。

      6.插入Flash按扭

      在文档中将鼠标定位到要插入Flash按扭的位置,选择“插入”—“交互式图像”—“Flash按扭”命令或单击插入栏“媒体”面板上的“Flash按扭”按扭,在弹出的“插入Flash按扭”对话框中首先在“样式”下拉列表框中选择一个Flash样式,输入按扭文本、字体大小、背景色、另存为.swf格式的Flash影片文件,确定即可。

      7.插入Flash文本

      在文档中将鼠标定位到要插入Flash文本的位置,选择“插入”—“交互式图像”—“Flash文本”命令,或单击插入拦的“媒体”面板上的“Flash文本”按扭,在弹出的“插入Flash文本”对话框中,设置相关选项并保存即可。

      8.插入其他多媒体对象

      在Dreamweaver中除了可以插入图片、Flash对象外,还可以插入其他的多媒体对象,例如:Applet小程序、QuickTime影片、音频、视频插件等。

      可以插入到网页的声音格式有很多,例如:Au、Midi、Wav、Mp3等声音格式,而在网站常用的格式就是Midi格式的声音文件,因为此格式本身就包含音阶,文件非常小,可以跨平台播放。

      插入网页背景音乐的步骤:将光标定位到网页文档中要插入背景音乐的位置,单击插入栏中“媒体”面板上的“插件”按扭,在弹出的“选择文件”对话框中选择一个音频文件,单击确定即可。

      对插件的主要设置属性有:

       插件或播放器名称:此项为播放器分配ID,以在脚本中引用。

       宽和高:默认值为32,这样只能显示播放器的一部分,如果要完整显示播放器可以设置稍大的值,例如200、30,此例中的播放器的宽、高属性为默认值,因为后面的步骤将要隐藏播放器界面。

       源文件:此项的文本域中显示嵌入到网页中的音频文件的URL路径。

       参数:单击此按扭,弹出“参数”对话框,在“参数”域中输入附加值,第一个参数是“hidden(隐藏)”值为“true(真)”,该值为布尔值,这个参数的意义是将播放器的界面隐藏起来, 因为作为背景音乐,不需要播放器的界面显示在网页上;第二个参数是“autostart(自动开始)”值设为“1”,该值为布尔值,作用是使音乐一旦加载到浏览器的网页中,就自动开始播放;第三个参数是“autorewind(重播)”,此例中值设为“1”,该值为布尔值,一旦音乐播放一周,又开始自动循环播放。

      提示:布尔值用来逻辑运算结果,结果可以为逻辑型的“true”(真)或“false”(假),且不区分大小写;用数值表示就是“1”或者“0”。

      表单、框架、模板和库

      表单元素:

      在Dreamweaver中,常用的表单对象有文本域、多行文本域、单选按扭、单选按扭组、复选按扭、下拉列表框、密码域、图像域等。

      在HTML文档中,表单的工作方式是首先标识表单最外层标记:
      和标记,表单所有的元素都在这对标记内,在起始标记
      内,有3个属性:actiont、method、target。

      一个完整的表单有两个基本部分组成:

       表单域():它相当于一个“容器”,所有的表单对象都放在里面,包含了处理表单数据所有程序的URL以及数据提交的方法。

       表单对象:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉列表框和文件上传框、字段集、单选按扭和复选按扭等。

      第 3 页 共 8 页

      T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

      创建表单、添加表单元素:

      1. 创建表单框架:

      选择“插入”—“表单”,在文档中插入一个表单域,选中“表单域”,单击“表单”选项栏中的“字段集”按扭,在弹出的对话框中输入提示标签文本“问卷——幸福指数调查”,选中表单域,在属性检查器中进行相应的设置。

      2. 插入表单对象:

      插入文本域,文本域有两种,即文本字段和文本区域,首先要插入文本字段,在插入栏上选择“表单”面板上的“文本字段”按扭,就插入了一个文本字段用来接受用户的输入,选中该对象,单击插入栏中的“表单”面板上的“标签”按扭,这时文档窗口切换到“代码视图和设计视图”同时显示的界面,在代码视图将插入点定位到标记之前、起始标记之后,输入文本“姓名”,在设计视图下,换行后用同样方法插入一个文本字段,将光标放在该文本字段之前,输入文本“性别”,同样,程序会把文本作为刚刚创建的文本字段的标签, 并插入到代码中,按照第2步,同样可以创建其他文本字段,分别是住址、E-mail信箱等3个文本字段。

      3. 插入文本区域:

      要添加文本区域前,为了便于处理页面的布局,先插入一个两行两列表格,表格的边框隐藏,插入点放在表格第一行的第二个单元格内,单击“表单”面板上的“文本区域”按扭,在表单中插入文本区域,在第一行的第一个单元格内,输入表单说明文本,例如“生活状态”,设置文本域的属性:名称、字符宽度、类型、初始值。

      4. 插入列表/菜单:

      列表/菜单可以用来使用户选择出生年月或其他投票等,单击“表单”面板上的“列表/菜单”,设置列表/菜单的属性,在“列表/菜单名称”文本域中输入“brith”,“类型”可指定是下拉列表框是以弹出菜单还是滚动的形式显示,勾选“允许多选”复选框,可以允许用户从列表中选择多项,单击“列表值”按扭,弹出“列表值”对话框,可以添加选项至弹出式菜单中,列表中的每一个选项有一个标签和一个值,使用+-按扭来添加删除列表中的选项,使用箭头来对列表项排序。

      5. 单选按扭和复选框

      6. 跳转菜单:

      跳转菜单看起来下拉列表框相似,但是不同的是此菜单中每一个项都是一个超级链接,当用户选择后会自动跳转到所选选项的值对应的目标Html文档或文件,在“插入跳转菜单”中添加菜单项、文本、选择时前往的URL、选择打开URL的窗口、菜单名称等参数,在列表值对话框中添加项目标签和值(跳转的目标地址),确定即可;在列表菜单文本域的属性中可设置列表名,类型为“菜单”或“列表”,以及初始时选定的标签项。

      7. 按扭:

      按扭一般只是为了实现提交数据和恢复初始数据,提交按扭的默认名称是Submit,重置按扭的默认名称是Reset,在按扭的属性检查器中可以自定义按扭标签、名称、动作选项。

      框架:

      框架是将几个网页集成到一个窗口,使用户浏览网页、搜索信息更容易,框架页面将浏览器的窗口分为多个显示区域,每一个显示区域称为一个框架,它包含一个独立的、可以滚动的页面。

      一个典型的框架网站,主页的窗口中包括3个不同的HTML页面,顶部是广告条,左侧是Logo和导航链接列表,单击左侧的链接可以 在右侧的主窗口中显示相应的具体内容。

      使用框架:

      框架分为两个部分:一个框架集和单个的框架。DW中“框架”面板上预定义的框架集有13种。

      在插入栏的“框架”面板上单击左侧和顶部嵌套的“框架”按扭,选择插入“左侧及上方嵌套”,将创建好的框架页全部保存,此时回单个保存框架集中的子框架,主窗口保存为,顶部窗口保存为,左侧窗口保存为,最后保存框架集。

      提示:如果要自定义框架,可以按住Alt键的同时,单击并拖拽一个框架,这样就可以新建一个框架,要删除一个框架,只要拖拽一个矿家到它的父窗口就可删除了。

      按shift+F2可以调出“高级布局”中的“框架”面板,或选择“站点”—“其他”—“框架”命令以显示“框架”面板,单击“框架”面板上的各个区域以激活文档窗口,默认的框架名称为topFrame、leftFrame、mainFrame,在各个窗口的属性中可以设置是否滚动、边界宽度和边界高度、边框显隐、边框颜色、是否能调整大小等。

      不同框架之间页面的跳转:

      第 4 页 共 8 页

      T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

      单击left窗口中的链接使对应的页面显示在main窗口中,在left窗口中设置链接的目标属性来实现这种跳转。

      实现跳转步骤:将插入点放在left窗口的链接文本中间,在属性检查器上的“链接”选项域中设置跳转到的目标文档,在“目标”下拉列表框中选择要在那个框架下跳转,若在主窗口中,则为“mainFrame”,这样保证了单击左侧窗口中的链接后,在主窗口中显示链接的页面。

      模板:

      模板是一种文件,可以用它作为创建其他文档的基础,用它处理网页不但工作效率高,而且可以统一网站的风格。在多个页面中反复出现又不需要经常变更的内容可以设为模板的不可编辑区域,而在可编辑区域就可以根据不同的页面替换为新内容。实际上,模板的功能就是把网页的布局和内容分离,通常是把大致布局设计好之后,保存为模板,然后在通过模板创建新文档。

      将“文件”面板切换到“资源”选项卡,单击左侧的“模板”按钮,面板上显示了该站点的模板文件以及模板缩略图。

      创建模板:

      创建模板又两种方法:即可以从新建的空白HTML文档中开始创建,在其中添加图像、表格、文本等对象,然后保存为模板;也可以把现有的布局合适的HTML文档保存为模板,这也是最简单的方法。

      在“站点”面板中,双击以打开要保存为模板的HTML文件,将光标定位到文档的空白区域,选择“插入”—“模板对象”—“可编辑区域”命令,弹出“新建可编辑区域”的对话框,在“名称”文本框中可以输入一个名称,单击“确定”即可;文档中显示的蓝色矩形框已经为模板文件添加了可编辑区域,选择“文件”—“另存为模板”命令弹出“另存模板”对话框,在“另存为”文本域中输入文本,为模板命名,单击“保存”按钮后,DW将自动在站点根目录下创建一个名为“template”的模板文件夹,刚刚创建的模板文件,保存在该文件夹内。

      库:

      库保存在网站的“库”文件夹内,称为库项目,在DW的文档插入库文件时,是把库项目的备份代码块应用到页面而已,面板中保存的库项目是源文件,而插入到页面的库项目是它的实例,实例会随着代码的改变一起更新。

      为站点创建了库项目之后,会发现DW在站点跟目录下自动创建了一个名为“libray”库文件夹,库项目就保存在该文件夹中。

      在页面上应用库项目:库项目创建好之后,要应用到站点的多个页面上,打开一个页面,将“文件”面板切换到“资源”选项卡的“库”面板上,单击一个库项目并拖拽到左侧文档的适合的位置,插入到文档中的库项目显示为一个浅黄色的色块以示区别,它默认是被锁定的,不可以编辑,插入到文档的库项目在浏览器中输入的颜色是正常的,没有颜色。

      提示:如果要将文档中的插入的库项目变成可编辑,必须将库项目实例与“库”面板上源文件分离,在选中库实例之后,在属性检查器上单击“从源文件中分离”按钮,会弹出一个对话框,提示:如果将库项目变为可以编辑,当源文件改变时,它不会随之更新(失去了链接关系),确认后,单击“确定”按钮。

      提示:打开文档窗口中的*.lbi的库文件,在页面上对文字进行格式修改后保存,保存后立即弹出“更新库项目”窗口,提示同时更新应用到网页中的库项目,单击更新按钮,在确定更新后,又弹出一个“更新页面”的对话框,提示更新应用了库项目的具体页面,显示记录完成之后关闭,此时,应用了库项目的网页已全部更新。

      CSS样式、层和行为

      CSS样式表:

      在制作网页时,无论是用代码直接编写HTML文档,还是利用所见即所得的软件工具进行编辑网页,经常是受HTML语法和编辑环境本身的限制,在文字排版和整体布局方面总是不能尽如人意,为了弥补这项缺憾,W3C组织发布了一套独立于HTML语法的网页制作规范CSS(层叠样式表)。

      CSS样式分为外部样式、内嵌样式、行内样式3种类型。

      引用外部样式,可以通过链接或导入的方式引用。

      而内嵌样式只影响某一个页面,样式是写在单个文档的标记内的,例如:

      行内样式只影响页面中的某一段,例如:

      CSS的作用如下:

       可以覆盖浏览器上样式的设置

       使页面的字体更漂亮、易排版、页面赏心悦目

       可以轻松地控制页面布局

      第 5 页 共 8 页

      T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

       可以将多个网页的风格格式同时更新,免去单个手动更新的繁琐

      熟悉CSS样式面板:

       附加样式表:可以用链接或导入的方式引用一个外部CSS样式

       新建CSS样式:创建一个新的样式

       编辑样式表:返回到样式定义的对话框内进行编辑

       删除CSS样式:可以将一个样式表删除

      新建一个CSS样式:

      新建CSS样式有3种类型:分别是“创建自定义样式”、“重定义HTML标签”、“使用CSS选择器”。

      1. 创建自定义样式:如果一个网页中的个部分内容需要使用不同的样式,或者多个网页之间需要使用不同的样式,此方法可以解决。

      2. 重定义HTML标签:此方法重定义HTML标记的默认属性,为现有的标签加入样式进行修饰,设置一旦完成,不需要任何操作即显示到网页的外观,另外,还可以将重定义的HTML标签定义、保存在一个独立的CSS样式中,便于在多个文档中引用。

      3. 使用CSS选择器:此方法用于特殊标签的组合或者包含有指定ID属性的所有标签进行格式定义,典型的用法就是对超链接文本的定义。

      CSS选择器可定义的4个标签:

       a:link:超级链接的正常状态

       a:visited:访问过的超级链接状态

       a:hover:光标移至超级链接上时的状态

       a:active:选中超级链接的状态

      在网页中应用“内嵌样式”:

      为页面实现浅蓝色背景,浏览时在窗口内侧加绿色边框,以及使body部分的文本块和浏览器窗口保留一定的空距等效果,具体步骤如下:

      1. 按照前面创建CSS的方法,创建一个重定义HTML标签,在对话框内的“标签域”输入“body”,并定义在“仅对该文档”。

      2. 在弹出的“body的CSS样式定义”对话框内,选择“分类”列表中的“背景”选项,然后在“背景颜色”的文本域中输入“#EEF7F0”。

      3. 在“分类”列表中选择“盒子”选项,在“填充”属性中设置相关参数,以使文本主体内容距离窗口保持30像素的距离。

      4. 在“分类”列表中选择“边框”选项,在“样式”、“宽度”、“颜色”组中勾选“全部相同”复选框,以保证只要在第一个下拉列表框中设置一个参数,其他3个与之保持一致,这样窗口将显示两个像素的边框。

      在网页中应用“自定义样式”:

      1. 将光标定位到文档的文本块中,单击工作区右侧的“CSS样式”面板上的创建好的自定义样式,此时样式就应用到了文档窗口中的文本块。

      2. 单击文档窗口上方的“显示代码视图”按钮,此时看到文本块包含在

      标记之间,并在

      标记内嵌入了一个CSS样式。

      为网页应用行内样式:

      行内样式是采用了HTML标记的“style”属性定义样式,它的特点是定义某一个标签的样式风格,只对所定义的标签起作用,并非对整个页面起作用。

      例如:要在某HTML文档中段落文本的头部插入几个文字“中国旅游”作为小标题,为这几个文字设定特殊的颜色、字体样式和大小,就要单独为其定义样式,具体步骤如下:

      1. 插入点定位到文档中的水平线的上方,输入文字“中国旅游”。

      2. 选中文字“中国旅游”,切换到代码视图,在包含文本“中国旅游”的

      标记内设置style属性,就可以应用行内样式了。

      提示:这种应用样式的优点是优先级高,可以直接把样式写到标记内,缺点是需要单独手写、修改,不便于维护更新。

      为网页应用外部样式:

      创建一个单独的CSS样式文件,好处就是可以提供给站点内部其他页面共享,方法就是通过链接或导入,实现为网页引用外部样式。具体步骤如下:

      1. 打开站点目录下的HTML文档,单击“CSS样式”面板底部的“附加样式表”按钮,弹出“链接外部样第 6 页 共 8 页

      T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

      式表”对话框,单击对话框中“文件/URL”文本域后的“浏览”按钮。在弹出的“选择样式表文件”对话框中,单击站点目录下的CSS文件夹,选择.css文件。

      2. 确定后转到“链接外部样式表”对话框,在对话框内“添加为”选项后有两个单选按钮:“链接”和“导入”,选择“链接”,此时的文档窗口中显示,链接的CSS样式已经应用到了当前文档的标题和超链接部分。

      应用层:

      层本身是一个透明的容器,可以把图片、文本、动画、表单、表格等元素放在里面,使用它不仅可以按预期的心爱你广发安排网页上的各种元素,还可以把各元素按照序号以层叠的方式排列,而且层具有显示和隐藏的属性,层可以放在网页上的任何地方。

      创建层:

      1. 选择“插入”—“层”命令,这样就插入了一个预定义大小的层。

      2. 或者单击插入栏中的“常用”面板上的“描绘层”按钮,鼠标移到文档窗口后变为十字型,按下鼠标左键在文档窗口中拖拽,直到绘制一个大小满意的区域,释放鼠标后,一个新层绘制完毕。

      3. 显示在层左上角的黄色小块是层标记,如果在窗口中不可见,选择“查看”—“可视化助理”—“不可见元素”命令,此标记即可在窗口中显示。

      如果想在一个层内再嵌套层,按以下步骤可以实现:

      1. 将光标插入点放在已经创建的层内。

      2. 单击插入栏的“常用”面板上的“描绘层”按钮,在文档窗口中光标变为十字时,按下鼠标拖拽以创建一个嵌入的层。

      3. 要创建多个嵌套层,继续执行前一步即可。

      通常将嵌入的层也称为子层,嵌入层的外层称为父层。嵌套层之间有继承关系,拖拽父层,子层会跟着移动,子层的显示属性同样也继承父层。

      “层”面板:

      创建层之后,可以在“层”面板中查看层,选择“窗口”—“其他”—“层”命令,“层”面板显示在工作区右侧的“高级布局”面板中,在面板上显示的“眼睛”图标列,可以设置各层的显示属性,“名称”列显示了默认的层名称,可以在此修改,“Z”是Z轴,在“层”面板中可以看到三个层是嵌套的关系,第二、第三个层从属于于第一个层,所以“Z”取值相同。

      提示:如果在创建层时,发现不能在原有层上面叠加其他层或层之间不能嵌套,是因为勾选了“防止重叠”,可以修改层面板中的该项设置。

      设置“层”的属性:

      “层”的属性检查器上显示的各个参数具体设置如下:

       层编号:此项可为层设置标识符,可以在此项的文本域中输入以自定义层的名称,默认名称是Layer1、Layer2…。

       左、上:指定层相对于文档窗口或父窗口左、上边框的位置,即层的左上角坐标值,通过输入值后对层进行定位,单位是像素(px)。

       宽、高:指定层的宽、高值。单位默认为px,此项值会随着层的变化而变化。

       Z轴:指定层在第三维度的排列顺序,即层的堆叠顺序号,取值包括0、负数和正数,多个层排列时,Z轴值最大的是显示在最前面的层。

       显示:指定层的初始显示状态,此项的下拉列表框内有4个选项:

      Default:默认,浏览器一般将其视同Inherit(默认)

      Inherit:继承父层的可见性,即与父层的可见性保持一致(继承)

      Visible:可见即显示内容,与父层显示与否无关(可见)

      Hidden:不可见即隐藏内容,与父层显示与否无关(隐藏)

       标签:下拉列表中框有两个选项SPAN和DIV,指定代码中以哪种标记定义层,因为SPAN是行级标记,一般情况下建议用DIV。

       溢出:指定层是否显示滚动条。

       剪辑:定义层的可见区域,在上下左右4个项输入值指定窗口距离层边界的距离,默认为空。

      利用“层”的属性结合“时间轴”做交替显示的层:

      1. 在DW中打开一个HTML文档,通过在窗口中拖拽绘制4个层,通过设置对齐属性,使4个层大小一致且重叠放置。

      2. 在“层”面板上每层的左侧的眼睛,使其显示或隐藏,在层的属性检查器中为4个层插入4种季节的背景第 7 页 共 8 页

      T905-余学兵 Dreamweaver静态网页Html标记代码汇总 2011-9-5

      图,并在每层的相同位置输入春、夏、秋、冬文字,调整字号大小一致。

      3. 当4个层的背景图和文字都处理完后,选择“窗口”—“其他”—“时间轴”命令,打开“时间轴”面板,需要在时间轴的帧上设置层的显示和隐藏属性,以形成动画效果。

      4. 首先,在“层”面板上将4个层都设为显示,在文档窗口中选中最上面的层Layer4拖拽到“时间轴”面板上,然后再依次选中其他3个层,拖拽到“时间轴”面板上,此时的时间轴上显示已经创建了4个层对象的“动画条”。

      5. 将每层的动画条从默认的第15帧拖拽到40帧放下,然后在每个动画条的第10帧、第20帧、第30帧上,分别单击帧的同时按F6键,创建关键桢。

      6. 单击Layer4的第10、20、30、40帧,分别设置属性为隐藏;单击Layer3的第20、30、40帧,分别设置属性为隐藏;单击Layer2的第30、40帧,同样设置属性为隐藏。

      7. 此时,在浏览器 中测试4个层轮流显示的效果。

      行为、事件和动作:

      DW提供的行为是通过应用直观的命令语句,为网页中对象添加一些动态的效果和交互功能。行为是由事件和触发该事件的动作组成。对象就是发生行为的主体,而行为等于事件加上动作。事件就是浏览器生成的消息,告诉客户端的访问者执行哪些操作。例如鼠标经过可以生成一个OnMouseOver事件,鼠标点击可以生成一个OnCilck事件,而决定事件的性质则要看生成执行这个事件时调用的JavaScript代码,为文档窗口元素应用行为,对应的事件是OnLoad。

      添加行为:

      要打开“行为”面板,通过选择“窗口”—“行为”命令,“行为”面板就会出现在工作区右侧的面板区内,DW中提供的“行为”动作列表有:播放声音、打开浏览器窗口、弹出信息、调用JavaScript、改变属性、恢复交换图像、交换图像、设置文本、转到URL、显示-隐藏层(为导航条做OnMouseOver和OnMouseOut事件的下拉菜单)等,为对象添加完成行为后,还可以为行为选择适应的事件,以达到用户在浏览网页时的交互式效果。

      为按钮添加行为以实现关闭浏览器窗口:

      在HTML文档中选择一个“关闭按钮”图片,在“行为”面板中单击“加号”按钮,在弹出的菜单中选择“调用JavaScript”,在弹出的“JavaScript”对话框内的文本域中输入语句“close();”,意为此图片一旦被处理,即调用这个“close();”方法,把窗口关闭。

      提示:凡是应用到JavaScript语句的时候,在语句结尾一定要加上一个“分号”作为结束,作为设置页面上关闭窗口的控件,可以是图片、动画、文本或超链接等。

      利用虚拟机安装DW和Access制作简易 留言板:

      1.创建IIS服务器和以及MS Access数据库,还有ODBA数据源,并创建DW软件;

      2.在DW中插入DIV标签,标签中创建3行3列的表单,分别创建姓名帖和留言帖,姓名帖处插入文本字段,宽度设置为10,留言帖处设置文本区域,设置为10行,插入提交按扭和重置按扭,保存为。

      3.在IIS服务器上选择默认网站路径指向站点的文件夹,注意要在默认网站属性中的文档中添加,并上移至第一位;

      4.新建空Access文件,右侧点击新建空数据库,保存到本地站点文件夹内,默认命名为,在表中创建name文本和text文本,保存到站点内,命名为table_1,

      5.点击ODBA数据源,选择系统DSN,添加MS ACCESS Driver(*.mdb),完成之后为数据源起名为web,选择数据源指向到站点跟目录,确定即可;

      6.回到DW,在右侧工具栏中选择应用程序,在数据库中点击加号,选择数据源名称(DSN),设置连接名称为本地站点名称myweb,点击测试,出现成功建立连接脚本提示信息,确定成功创建后台连接数据库;

      7.创建一个留言成功的页面,新建一个ASP VBScript文件,保存为 ,内容为“留言成功,谢谢!”;

      8.为文本字段该名为name,为文本区域改名为text,点击网页的标签,选择服务器行为中的“插入记录”,选择连接到web,插入后转到,表单元素中,name插入到“name”文本,text插入到“text”文本,确定。

      9.F12进行留言测试,检验数据是否成功提交到后台Access数据库,并跳转到留言成功的的页面上。

      第 8 页 共 8 页


      本文标签: 插入 网页 文本 显示 选择

      更多相关文章

      ChatGPT 网页版现重大 Bug,修改网址即可一键令 GPT-3.5“升级”为 4.0

      2月前

      据 X 平台多名用户反馈&#xff0c;ChatGPT 网页版日前出现了重大漏洞&#xff0c;只需修改网址即可一键令 GPT-3.5 版本“升级”为 4.0。 据悉&#xff0c;用户只需进入 ChatGPT 官

      ChatGPT API 比网页版更智能吗?

      2月前

      我已经通过网络界面使用 ChatGPT 一段时间了。最近&#xff0c;我在这里看到了一些帖子和评论&#xff0c;表明与网络版本相比&#xff0c;API 的响应似乎“更智能”或质量更高。 我很想听听您对此的经历和

      免费快速部署ChatGPT线上聊天网页:ChatGPT API + Github + Railway

      2月前

      1、使用工具 &#xff08;1&#xff09;需要自己生成的openai api&#xff0c;获取API的网站&#xff1a;openAI API 获取方式&#xff1a;OpenAI的API

      2023商业版ChatGPT网页版源码V4.4+有后台功能配置多

      2月前

      正文: 4.4版本来了 V4.4 新增注册用户赠送次数自定义 修复前端密钥明文 V4.3 优化首页加载CSS 之前加载的时候div块会往左边跑 代码安全性逻加强 优化首页输入框换行过高的问题 安装教程: 搭建宝塔 解析

      【ChatGPT实战】5.使用ChatGPT自动化操作网页

      2月前

      在当今数字化的时代,网页已经成为了人们获取信息、娱乐、社交和购物等方面的主要途径。然而,随着我们对网页的需求和使用不断增加,我们也经常会面临着一些繁琐的网页操作,例如自动填充表单、自动化浏览和搜索等,这些操作可能会浪费我们宝贵的时间和精力。

      2023最新ChatGPT3.5网页版源码+支持用户购买会员套餐

      2月前

      正文:  第一步-配置APIKEY:在"index.php"最顶部配置自己的APIKEY&#xff0c;不然网站无法使用&#xff01; 第一步-配置数据库:libconfig.php 第三步-导入

      零代码编程:用ChatGPT爬取网页数据遇到乱码怎么办?

      2月前

      今天用ChatGPT写了一段代码&#xff0c;爬取中文网站数据&#xff0c;提示词如下&#xff1a; 写一段Python程序&#xff0c;爬取网页数据并保存到excel表格。 具体步骤&#

      使用Flask Web创建一个调用ChatGPT API的网页--简单示例(Windows环境下)

      2月前

      前提:你应该要有一个能正常使用chatGPT的openAI账号;即你已经成功注册了chatGPT,并能正常使用。 文章目录 一、主要组成部分二、示例代码2.1 工程结构:2.2 说明2.3 依赖环境2.4 app.py代码2.5 index

      二、用 ChatGPT 充当网页开发者

      2月前

      目录 一、实验介绍 二、背景三、如何让 ChatGPT 充当网页开发者 3.1 调整话术——指定编程语言 3.2 在线展示 Web 页面 3.3 加上搜索功能 3.4 代码很长怎么办? 四、如何学习上面的代码? 五、实

      【Python】极简部署私有化ChatGPT-Web,使用Flask框架编写网页版ChatGPT

      2月前

      极简部署私有化ChatGPT 使用ChatGPT最新API创建的聊天页面&#xff0c;模型回复效果与官网的ChatGPT一致特性演示动图使用前提介绍 使用ChatGPT最新API创建的聊天页面&#xff0c;模型回复效果与

      苹果手机连wifi跳不出来登录网页解决办法

      2月前

      1.点开要连接wifi后面的小叹号“&#xff01;”&#xff0c;打开“自动登录” 2.打开设置&#xff0c;关闭SAFARI的“阻止弹窗” 3.重新连接wifi 转载于:https:wwwblogss6

      教你如何使用Windows电脑对IOS手机上的网页进行调试

      2月前

      前期准备 PC端安装Chrome浏览器。苹果手机一部。连接电脑数据线一条。梯子。PC端安装iTunes或者爱思助手。 苹果手机设置 打开“设置”→找到“Safari 浏览器”点击进去→往下滑找到“高级”进行点击→打开“Web检查器”。

      android系统编辑器,Android系统上的Notepad++文本编辑器_920 Text Editor V1.0 下载

      2月前

      Notepad编辑器在windows上是很受大家欢迎的&#xff0c;而在手机上却一直不见它的身影&#xff0c;其实也有替换品的&#xff0c;例如920 Text Editor就是Android安卓手机系统上的N

      为什么我电脑的所有浏览器都开不了网页

      2月前

      一、问题描述二、解决办法1、把注册表中的 ProxyEnable 数值 1 改为 02、360安全卫士修复 三、他山之石 一、问题描述 使用某些代理上网软件&#xff0c;没恢复设置会出现&#xff1a;网络连接正常&

      php无头浏览器采集教程,JavaScript_使用phantomjs进行网页抓取的实现代码,phantomjs因为是无头浏览器可以 - phpStudy...

      2月前

      使用phantomjs进行网页抓取的实现代码 phantomjs因为是无头浏览器可以跑js&#xff0c;所以同样可以跑dom节点&#xff0c;用来进行网页抓取是再好不过了。 比如我们要批量抓取网页 “历史上的今天” 的内

      Unity 工具之 内嵌网页浏览器 web viewbrowser 插件的整理大全(包括Window Mac Android iOS 等)

      2月前

      Unity 工具之 内嵌网页浏览器 web viewbrowser 插件的整理大全&#xff08;包括Window Mac Android iOS 等&#xff09; 目录 Unity 工具之 内嵌网页浏览器 w

      局部页面切换url为什么不变_python爬虫 - 翻页url不变网页的爬虫探究!

      1月前

      python爬虫-翻页url不变网页的爬虫探究 url随着翻页改变的爬虫已经有非常多教程啦,这里主要记录一下我对翻页url不变网页的探究过程。学术菜鸡第一次写CSDN,请大家多多包容~ 如果对你有一点点帮助,请帮我点个赞吧! 翻页url不变

      局部页面切换url为什么不变_python爬虫 - 翻页url不变网页的爬虫探究

      1月前

      python爬虫-翻页url不变网页的爬虫探究 url随着翻页改变的爬虫已经有非常多教程啦,这里主要记录一下我对翻页url不变网页的探究过程。学术菜鸡第一次写CSDN,请大家多多包容~ 如果对你有一点点帮助,请帮我点个赞吧! 翻页url不变

      Windows 7上可以上QQ,无法访问网页的DNS解析的解决

      18天前

      引言&#xff1a;  最近这几天忽然windows 7无法访问网页了&#xff0c;但是&#xff0c;可以正常上QQ&#xff0c;dropbox同步数据等&#xff0c;于是就开始了查找问题之路

      计算机 - - - 浏览器网页打开本地exe程序,网页打开微信,网页打开迅雷

      14天前

      参考文章&#xff1a; https:exe.yimenappinfo-exe-sheng-cheng-url-29533.html https:blog.csdnuote_earticledetails13372

      发表评论

      全部评论 0
      暂无评论
      :设置表格栏标题(表头),显示为粗体子此标记可以省略