dw表格应用之细线框的制作.docx
- 文档编号:13332138
- 上传时间:2023-06-13
- 格式:DOCX
- 页数:6
- 大小:19.04KB
dw表格应用之细线框的制作.docx
《dw表格应用之细线框的制作.docx》由会员分享,可在线阅读,更多相关《dw表格应用之细线框的制作.docx(6页珍藏版)》请在冰点文库上搜索。
dw表格应用之细线框的制作
竭诚为您提供优质文档/双击可除
dw表格应用之细线框的制作
篇一:
dreamweaver怎么制作网页教程dw建站设计网页
dreamweaver怎么制作网页教程dw建站设计网页出处:
西西整理作者:
西西日期:
20xx/2/2816:
51:
36[大中小]评论:
1
|我要发表看法它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。
这里西西给大家带来一个dreamweaver制作网页的教程,初学dw的朋友可以参考一下。
一、定义站点
1、在任意一个根目录下创建好一个文件夹(我们这里假设为e盘),如取名为myweb。
***备注:
网站中所用的文件都要用英文名。
2、打开dreamweaver,选择“站点—新建站点”,打开对话框。
在站点名称中输入网站的名称(可用中文),在本地根文件夹中选择刚才创建的文件夹(e:
web)。
然后确定即可。
***备注:
再次打开dreamweaver,会自动找到刚才设立的站点。
如果有多个站点,可以在菜单“站点—打开站点”中去选择。
二、创建页面
1、在本地文件夹e:
\myweb下面的空白处,按右键选“新建文件”,这样就建好了一个页面,默认的文件名为untitled.htm。
htm就表示这个网页文件是一个静态的html文件。
给它改名为index.htm。
***网站第一页的名字通常是index.htm或index.html。
其它页面的名字可以自己取。
2、双击index.htm进入该页面的编辑状态。
在标题空格里输入网页名称,按右键选页面属性,打开“页面属性”窗口。
在这里可以设置网站的标题、背景颜色或背影图像,超级链接的颜色(一般默认即可),其他都保持默认即可。
3.此时光标位于左上角,可输入一句话,如“欢迎来到我的主页”。
选取文字,用菜单“窗口/属性”打开属性面板,选取文字大小为6,再使文字居中,然后在文字前用几个回车使其位于页面中间。
4.如要选取字体,则选择字体中的最后一项:
编辑字体列表。
然后在对话框中选+号,接着在“可用字体”栏中选择需要加入到字体列表中的一种字体,点击中间的按钮就可以加入了。
***在网页上最常用的是宋体字。
不要将特殊的字体加到列表中使用,因为别人电脑上未装就看不到。
如果需要用的话,要做成图片后再使用。
***在网页上打入空格的办法是:
把输入法调为全角。
***在网页上换行的办法是:
shift+enter。
只按enter则为换段。
三、为页面添加图片
1、在本地文件夹e:
\myweb下面的空白处,按右键选“新建文件夹”,这样建立了一个文件夹,用它来放图片,可以改名为tu或pic或images都可以。
2、用菜单“窗口/对象”打开对象面板,点击“插入图像”,在对话框里选要插入的图片。
如果会出现对话框:
“你愿意将该文件复制到根文件夹中吗?
”,必须选“是”,然后将它保存到刚建好的文件夹里。
3、选中该图片,打开属性面板,可以在上面为图片取名,重新设置图片的高、宽,拖住图片角上的点可以变大小。
按住shift键,再拖动角上的点,可以使图片保持宽高比例拉伸。
如要恢复这原始大小,则单击右下角的“重设大小”按钮。
4、“链接”可以直接在这里输入地址。
“替代”是图片的说明,即鼠标指向图片所显示的文字;“边框”是图片边框宽度,“对齐”是对齐方式。
四、添加超级链接
1、为文字添加链接。
比如,在页面上输入“我的文章”,然后将其选中,打开属性面板,在“链接”一格中,选择它所要链接到的页面即可。
后面一格“目标”我们一般常用的是self即打开的新窗口代替了现开的窗口;或是选择blank即打开新窗口。
2、为图片添加链接
与上面文字的链接同理,插入图片,然后在属性面板中的链接一格中选择即可。
****图片可以创建不同的多个链接。
方法如下:
在属性面板中的“地图”一项下面有一些图形,比如点击方形,光标变成十字,在图片上画一个蓝色矩形的热区,此时在属性面板上可以为这个热区设置链接地址,鼠标指向会显示。
同样,再用圆形设置一个热区,就可以再为该图片设置其他链接了。
3、添加e-mail链接
选中需要添加e-mail链接的文字或图片,打开属性面板,在“链接”一格中输入填写邮件地址。
格式如下:
mailto:
邮件地址。
注意中间不空格。
4、如果链接到浏览器无法打开的文件,例如exe、zip等文件,那么浏览者在点击这个链接的时候,就会实现文件下载、或是在线播放的功能。
五、表格的使用
中
方法二:
直接给一个,注意要放在的外面。
三、页面
1.页面背景颜色及文字颜色:
均是作为body标记的属性来进行设置。
bgcolor:
背景颜色;text:
静态文字的颜色;
link:
可链接文字的颜色;alink:
点击链接时文字的颜色vlink:
访问过链接的颜色。
2.背景图像-作为body标记的属性来进行设置
background=图像的相对路径,
注释:
由于放图片的img文件夹和网页a1.html同为test文件夹下的成员,所有盘符和test文件夹中路径当中就可以省略了。
3.插入图像:
src:
图像存放路径,alt:
图像解释文字,width和height是图像中页面中显示的大小,align指的是图像相对于文字的对齐格式
4.插入声音:
标记:
src:
声音文件存放路径;autostart:
自动播放;
loop:
循环播放,其值可以是true/false,也可是数字代表循环次数hidden:
隐藏播放器;width和height是播放器大小
标记:
src:
声音文件存放路径
loop:
循环播放,其值可以是true/false,也可是数字代表循环次数注意:
bgsound嵌入声音文件默认自动播放和隐藏
四、表格
:
表格的起始标记:
align属性控制整个表格相对于页面的对齐方式
width和height属性控制整个表格的宽和高
border属性控制表格边框粗细
:
表格的行标记
align属性控制表格内容相对于表格单元格的对齐方式
bgcolor:
该行的背景颜色
width和height控制当前行的宽和高
:
表格的列标记
在表格中是先画大框架,再画行,行里面画列
控制表格内容字体可加标记
五、超级链接
链接内容
链接内容的地址:
1.相对路径(本地机器上的某一个页面、图片、文件)
2.电子邮件地址:
××××@####:
注意,href后面跟的是mailto:
××××@####
3.internet上的某一个网站的地址
链接内容:
1.文字,2.图片
六、框架网页
框架网页是由框架集页面与分框架网页构成
框架集页面:
rows:
表示将页面横向划分,可以采用像素/百分比/比值三种形式ex:
rows=80,*就代表将页面分为上下两个部分,上方高为80像素其余部分为下方所占。
cols:
表示将页面纵向划分
分框架网页:
src:
该框架所包含的页面的路径
name:
该框架的名称,以便以后添加链接使用。
七、滚动文字
:
使标记之间的对象滚动起来
direction=left(默认)/right/up/down
behavior=alternate(交替)/scroll(循环)/slide(幻灯片)bgcolor=滚动条的背景色
添加行为:
onmoseover=stop()鼠标放上停止滚动
onmouseout=start()鼠标离开开始滚动
第二部分:
dreamweaver8
第三次课:
dw基础
一、文字的录入
1.换行
:
shift+enter
段落
:
enter
2.插入空格:
插入——html——特殊字符——不换行空格
在源代码中输入空格字符
ctrl+shift+space
编辑——首选参数——编辑选项——允许输入多个连续空格
3.插入日期:
插入——日期——弹出日期对话框——选择日期/星期/时间的显示格式
常用工具栏——日期图标——弹出日期对话框——进行设置
4.插入水平线
插入——html——水平线——属性面板可以设置水平线属性常用工具栏——html工具栏——水平线按钮
二、文字的编辑
1.文字的基本操作:
(选取/复制/粘贴/剪切全部同word一样)注意:
选择性粘贴可以选择仅粘贴文本,也可以选择带样式粘贴
2.文字的属性设置:
在属性面板中选择相应的设置选项即可
3.背景颜色及图案可以在属性面板中的页面属性进行设置
篇三:
如何用dw和Fw制作网页(初步入门)教程
如何用dw和Fw制作网页(初步入门)教程
1.用fw做一个页面的蓝图,大小尺寸及颜色都按照未来页面实际情况来。
这样做的好处就是可以加强页面的整体感。
2.用fw的切片工具切图。
注意:
1>切图前先大致构思好未来网页的布局、表格、框架等。
2>图片尽可能的小,对于大面积且有重叠规律的图片,只取其重叠方向的一个像素宽的图片,用来做页面局部背景的图片,这样利用背景的重叠性就可以实现蓝图中的效果并且很大程度上减小了页面的体积。
3>诸多切片的边界尽可能多的处于同一横坐标或纵坐标上。
3.导出切片(鼠标放在切片上右键“导出所选切片”),并命名(简单易记易懂的名字可以使你后来的工作事半功倍)。
图片的格式在文件>>>导出预览面板里设置,按照gif(128),gif(256),jpg的先后顺序,导出格式首先考虑前面的,在满足不了颜色质量要求的情况下再考虑后面的导出格式。
4.用dw创建新页面。
页面的顶间距(topmargin)和左间距(left-margin)一般都设为0,但顶间距(topmargin)也可以不是0,视你的设计要求而定.
5.按照页面整体的布局,用dw插入表格
居中,一般宽度为775(考虑到800*600像素显示器下无横向滚动条),但也没有定论。
这里我选择了230,因为我要做的是bk设计的qq迷你门户。
只考虑宽度,先不用考虑表格高度,因为以后插入的图片和表格会将高度撑起来
6.按照布局的需要可以在整体表格里嵌套表格以达到精确布局。
插入图片及背景图片。
插入背景图片的时候要注意控制好背景所属单元格的高度和宽度,因为背景撑不起表格所以需要手工设置td的宽度width和高度height的值
另外两个小技巧:
1〉设置高度小于5像素的单元格td时,dw无法从设计模式下实现。
实现的方法:
先在属性面板里将高度height的值设置为你要的高度值,接着用鼠标单击该单元格内部,然后将界面切换到代码模式下,此时在闪动的光标附近你将会看到""的代码,
删掉它,最后切换回设计模式下你发现了什么呢?
呵呵~
2〉dw创建的表格如果设置边框bordor的值为1的话,你会发现它并不美观。
如何实现美观纤细的细线表格?
这个问题是个老问题了,请参考:
/n4783c2.shtml
7.这样的话,网页就基本作成了,然后添加进去文字内容及你需要的特效,字体的大小和样式可以在选择上文字之后属性面板里修改
8.大功告成,文件保存为.htm或者其他格式的网页。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- dw 表格 应用 细线 制作