dw全部教程

整理文档很辛苦,赏杯茶钱您下走!

免费阅读已结束,点击下载阅读编辑剩下 ...

阅读已结束,您可以下载文档离线阅读编辑

资源描述

Html教程:一、新建网页及保存:1.开始——附件——记事本2.打开记事本,输入源码3.文件——另存为——文件名(a1.html),保存类型(所有文件)——保存二、文字格局:1.换行标记pre/pre:原样显示文本br:换行p/p:段落标记,比br多了一行空行2.文本格式:字体:font/font属性包含:face-字体;size-大小;color-颜色字体样式:b/b加粗i/i倾斜u/u下划线对齐方式:方法一:作为属性可以添加在p/p;div/div中方法二:直接给一个center/center,注意要放在font/font的外面。三、页面1.页面背景颜色及文字颜色:均是作为body标记的属性来进行设置。bgcolor:背景颜色;text:静态文字的颜色;link:可链接文字的颜色;alink:点击链接时文字的颜色vlink:访问过链接的颜色。2.背景图像-作为body标记的属性来进行设置background=图像的相对路径,注释:由于放图片的img文件夹和网页a1.html同为test文件夹下的成员,所有盘符和test文件夹中路径当中就可以省略了。3.插入图像:imgsrc=img\daiyu.jpgalt=黛玉是个好姑娘!width=200height=300align=leftsrc:图像存放路径,alt:图像解释文字,width和height是图像中页面中显示的大小,align指的是图像相对于文字的对齐格式4.插入声音:embed标记:src:声音文件存放路径;autostart:自动播放;loop:循环播放,其值可以是true/false,也可是数字代表循环次数hidden:隐藏播放器;width和height是播放器大小bgsound标记:src:声音文件存放路径loop:循环播放,其值可以是true/false,也可是数字代表循环次数注意:bgsound嵌入声音文件默认自动播放和隐藏四、表格table/table:表格的起始标记:align属性控制整个表格相对于页面的对齐方式width和height属性控制整个表格的宽和高border属性控制表格边框粗细tr/tr:表格的行标记align属性控制表格内容相对于表格单元格的对齐方式bgcolor:该行的背景颜色width和height控制当前行的宽和高td/td:表格的列标记在表格中是先画大框架,再画行,行里面画列控制表格内容字体可加font标记五、超级链接ahref=链接内容的地址链接内容/a链接内容的地址:1.相对路径(本地机器上的某一个页面、图片、文件)2.电子邮件地址:××××@####:注意,href后面跟的是mailto:××××@####3.internet上的某一个网站的地址链接内容:1.文字,2.图片六、框架网页框架网页是由框架集页面与分框架网页构成框架集页面:frameset/framesetrows:表示将页面横向划分,可以采用像素/百分比/比值三种形式ex:rows=80,*就代表将页面分为上下两个部分,上方高为80像素其余部分为下方所占。cols:表示将页面纵向划分分框架网页:frame/framesrc:该框架所包含的页面的路径name:该框架的名称,以便以后添加链接使用。七、滚动文字marquee/marquee:使标记之间的对象滚动起来direction=left(默认)/right/up/downbehavior=alternate(交替)/scroll(循环)/slide(幻灯片)bgcolor=滚动条的背景色添加行为:onmoseover=stop()鼠标放上停止滚动onmouseout=start()鼠标离开开始滚动第二部分:Dreamweaver8第三次课:dw基础一、文字的录入1.换行br:shift+enter段落p/p:enter2.插入空格:插入——html——特殊字符——不换行空格在源代码中输入空格字符 ctrl+shift+space编辑——首选参数——编辑选项——允许输入多个连续空格3.插入日期:插入——日期——弹出日期对话框——选择日期/星期/时间的显示格式常用工具栏——日期图标——弹出日期对话框——进行设置4.插入水平线插入——html——水平线——属性面板可以设置水平线属性常用工具栏——html工具栏——水平线按钮二、文字的编辑1.文字的基本操作:(选取/复制/粘贴/剪切全部同word一样)注意:选择性粘贴可以选择仅粘贴文本,也可以选择带样式粘贴2.文字的属性设置:在属性面板中选择相应的设置选项即可3.背景颜色及图案可以在属性面板中的页面属性进行设置三、链接的添加1.选择要添加链接的内容(文字/图片)2.在属性面板中找到链接选项:可以直接输入网址,也可以点击右侧浏览文件的按钮选择要链接的对象。3.在目标下拉框中选择需要的内容,如_blank三、插入flash1.flash方法:插入——媒体——flash/常用工具栏——媒体按钮——flash使背景透明的参数:切换到代码视图,找到插入flash的代码,添加一行新参数paramname=”wmode”value=”transparent”2.flash按钮:1.注意flash按钮的背景色和页面背景色保持一致2.flash的保存路径必须是全英文的。四、插入图像:方法:常用工具栏——图像按钮——插入图片注意:dw支持的格式:jpg,gif,png,不支持的格式:bmp第四次课表格一、表格的插入常用工具栏——表格按钮插入——表格ctrl+alt+t二、表格的基本操作1.选择整个表格将光标定位在某一单元格中,右键单击——快捷菜单——表格——选择表格,即可选择整个表格光标定位在某一单元格中——修改——表格——选择表格ctrl+a+a利用table标记2.选择表格的行/列:利用标记三、表格的属性边距(填充):表示的是单元格的内容与单元格边界(四周)之间的距离间距:单元格与单元格之间的距离对齐:表格属性中的对齐指的是整个表格相对于页面的对齐方式单元格属性中的对齐,指的是单元格内容相对于表格的对齐方式表格的格式化:命令——格式化表格特色表格的制作一、利用表格制作细线1.插入一个1×1的表格2.设置表格的边框、间距、边距均为03.设置表格的背景色为细线的颜色4.进入代码视图,将td/td标记中的 去掉,即可二、细线表格的制作1.插入一个3×4的表格2.设置边框=0,边距(填充)=0,间距=13.设置整个表格的背景色为细线的颜色(蓝色)4.选择所有单元格将单元格背景色设为白色,保存即可。三、制作隔距表格1.插入1×4的表格2.设置间距=2,边距(填充)=1,边框=03.设置所有单元格的背景色为隔距表格的边框色(绿色)4.在1×4的表格的每个单元格中插入1×1的表格,设置其宽度、高度均为100%,背景色设为白色。5.复制该1×1的表格,粘贴到1×4的表格的其他单元格中。保存预览即可。四、缺少边框的表格1.插入2×5的表格2.修改代码tableframe=##:visides,表示只显示左右边框,hsides表示只显示水平边框lhs表示只显示左边框,rhs表示只显示右边框,void表示不显示任何边框,above,只显示上边框,below,只显示下边框。五、制作立体表格1.插入一个2×5的表格2.设置单元格背景色为灰色“#b7b7b7”3.修改代码tablebodercolorlight=”#ffffff”bordercolordark=”#ffffff”tdbodercolorlight=”#000000”bordercolordark=”#eeeeee”第五次课电子相册的制作一、准备工作1.安装fireworks,并且在开始制作电子相册时将Dreamweaver和fireworks全部打开。2.将所有准备入相册的图片改成大小一致,并且放入同一个文件夹里(图片源文件夹dreamsky),保证路径为纯英文。3.建立一个存放相册的独立文件夹(目标文件夹photo),同时保证路径为纯英文。二、建立相册1.Dreamweaver的命令——创建网站相册——弹出创建网站相册对话框:相册名称、副标题、选择图片源文件夹(dreamsky)、目标文件夹(photo)、设置缩略图大小(100*100)、列数(4)、建立导览页面(选中)2.修饰页面:设置页面背景色为黑色更改标题样式,制作带阴影的文字插入——布局对象——层层中插入文字,设置为笔画较粗的字体(梦幻天空),颜色设为深色记录该层的位置、大小(左300px,上25px,宽是200px,高是45px)——属性面板鼠标在空白处单击一下(为了防止层的嵌套),再次插入一个新层,层中插入与第一层大小、字体相同的文字,颜色可设为与第一层色系相同,颜色较浅。将新层的大小、位置设为与第一层一致,并将该层偏左偏上微调(2个px即可),可利用键盘上的方向键,前提是选中该层。3.相册中文件夹的清单:index.html——相册首页images文件夹——原图的拷贝thumbnail文件夹——相册首页的缩略图pages文件夹——每个图片的导览页面第六次课环形导航布局1.在excel表格中涉及好布局,有7个flash按钮,则需建立(15×8)的表格。2.设置页面颜色为深色3.插入15×8的表格,表格边框设置为04.根据自己的设计,从表格的最右边最中间的部位开始合并单元格,将单元格合并完毕后,依次插入flash按钮,注意flash按钮和网页中同一个文件夹下,并且路径为纯英文。5.flash按钮的背景色与页面背景色保持一致,使页面效果协调6.插入主题图片,将其所在单元格的对齐方式设为垂直居中页面过渡效果设置:1.在常用工具栏中切换到html面板,单击文件头按钮,选择meta2.meta对话框:属性:HTTP-equivalent;值:page-exit内容:revealTrans(duration=x,transition=y)注意:加入我是从A页面过渡到B页面,我们是将meta标记放在A页面中的。此外,A页面的链接目标必须不是在新窗口打开。第六次课玩具总动员1.新建页面,插入一个2×2的表格2.将事先准备好的背景图片插入,将边框/间距/边距均设为0使得背景图片可以很好的贴合作一起。3.插入一个层,层中插入1×5的表格4.将光标置于1,3,5单元格内,选择插入——图像——鼠标经过图像5.在弹出的对话框中分别选择原始图像和鼠标经过图像即可6.选中“预载鼠标经过图像”的复选框,可以使得鼠标经过图像提前加载在页面缓存中,使得图像转换更为流畅。电影大世界制作一、框架集1.切换常用工具栏到“布局”工具栏——框架2.选择“顶部和嵌套的左侧框架”3.选中框架集网页,单击“文件”——“框架集另存为”——保存框架集页面film.html二、框架页1.依次建立6个页面:topfilm.html——顶部的标题页面left.html——左侧的菜单页面1.html~4.html为主框架中介绍电影的页面2.为各个框架指定源文件页面:将页面切换到film.html中按下alt键,同时点击要添加源文件的框架(topframe,leftframe,mainframe)中属性面板的源文件处,点击浏览按钮,选择对应的源文件网页。3.为left.html添加链接属性:回到film.html中,中此框架中的left页面里添加链接,注意,每个链接选择的目标是mainframe第八次课行为行为=事件+该事件所触发的动作,添加行为的对象一、弹出信息窗口添加行为的对象:body标记事件:onload动作:弹出信息二、设置状态条文本添加行为对象:带有空链接的文字(制作空链接:在文本区输入一行文字,选中,在属性面板的添加链接处输入一个英文状

1 / 16
下载文档,编辑使用

©2015-2020 m.777doc.com 三七文档.

备案号:鲁ICP备2024069028号-1 客服联系 QQ:2149211541

×
保存成功