精彩专题推荐:
建站之入门课
建站之必修课
建站之关键课
网站价值所在
流量提高专题
css+div 标准
个人网站打造全过程
网站搜索
收藏本站
联系我们
导航
:
建站首页
|
网站设计
|
网站开发
|
网站运营
|
网页软件
|
建站指南
|
搜索优化
|
图像处理
|
视频教程
|
书籍教程
|
建站专题
让你的网站产生收益赚钱,有博客和网站的绝对不能错过
将指定的流量带到你的网站,为你站增加有效的访客,为你提升业绩
当前位置:
首页
>
网页软件
>
Dreamweaver教程
>正文
孤风和你一起学Dreamweaver MX 2004
来源: 时间:07-02-24 点击:
点击这里收藏本文
昨天我们学习和制作了我们的框架,还记得要领么?一句话,妙用表格,事实上,也就是表格套表格,大表格里面套小表格。
框架是拉出来了,今天我们就填充一下里面的东西吧!首先要收集一些图片,当然,如果你的PS比较好的话,那你就自己制作几个图片,为了大家的学习方便,我将我使用的一些小的图片打包发到网上给大家下载。好了,先把我们的第一行的东西给填上去吧````
第一行第一个框我们是准备放我们的LOGO的````嘿嘿````先把图片放上去吧!
方法是点击“插入”-->“图片”
然后在弹出的窗口里点这个IMG文件夹
由于我不记得图片的名字,所以先点下这个图标,选择第一个“缩略图”
然后点下拉的那个箭头,找到我们事先做的那个LOGO图片
最后点“确定”你就可以看到图片被插到网页当中了。
如果你发现插得不是地方````那是因为````你先没有用鼠标点一下你准备插入的单元格````
如果没我说中了`````ctrl+z 重新来一遍吧`````
好了```我们来看一下效果`````
记得上一个教程中我们准备在LOGO的旁边放上广告的,现在你可以用同样的方法在这边插上一个广告图片。当然,你也可以插上一个FLASH做为广告,方法:插入-->媒体-->FLASH
选择和图片差不多````不过```这可没有缩略图哦````自己先看清楚吧````
我在这个位置写上广告位招租```
不过这样不好看哦````把它居中吧````好不?
把鼠标放到这里面````然后点这个`````和WORD差不多吧`````
就大功告成了`````
后面的联系方式那边怎么做呢??
一般那边分三个,设为首页 加入收藏 联系
站长
然后在前面加上一个小图标```
看到了么?
其实我们可以直接在里面输入,并插如小图就可以了,但这样的话容易混乱,所以我准备放一个三行二列的表格在这里面,有人反对么??
插入后略微调整一下。
用刚才的方法往里面插入小图片和文字。大家自己练习着做。
好了,这个已经做好了```可是```没什么背景````不好看`````
先用鼠标点一下刚刚插入的那个小表格的里面的任意一个地方,然后点这个地方<table>
第一章的时候我就说了```这里非常关键,这是表格的意思,你点了这个<table>那么你可以看到这个表格处与选中状态。
这个比较难理解,也不容易一下子就学会,大家要反复琢磨和体会,这个就是表格的意思,前面还有<table>这样的字符,这个就是外面的大一点的表格,点到最前面的<table>,就是我们制作的网页的最外面的表格了。大家现在不必理解透彻,在以后我们学习了HTML代码之后大家就自然理解了。现在我们只要知道这是表格的意思,另外点这个就能选中表格。
选中表格之后,我们按一下键盘的方向键的向右键 →
然后可以看到我我们的鼠标就在大一点的表格的单元格里面了。
这个不太容易一次就会,大家要细细琢磨。
然后我们回到属性那一栏,忘记了?就是下面的那一大块啊!!
看到“背景颜色”这四个字了么?其实这就是设置这一个单元格的背景颜色的控制按纽````
第一章里我们成功设置了整个网页的背景颜色,那么现在你设置这个单元格的背景颜色能成功么??
期望你能成功哦!!
好了!!我成功啦!!
好了```上一行的东西我们做得差不多了`````
现在我们开始做导航栏吧````这个设计其实有很多不同的方法,你们喜欢什么样的方法呢?我做了如图的效果:
分析一下,其实这是一个一行三列的表格,中间的图片是背景,两边各一个图片。
现在大家可能还不能理解我说的意思,我们慢慢来做。
先插入一个一行三列的表格,然后略微做一些调整,如图
先在第一个表格里面插入那张图片,方法大家都会了吧
第二个列就略微复杂了一点点,要仔细哦!!很重要的哦!!
先在那个单元格用鼠标点一下,然后到属性面板(不会用忘记了吧??看一下前面的!)
然后点这个文件夹一样的图标````出现的面板和插入图片的面板是一样的
就是这个,和刚才的一样吧````
然后找到如图名字的图片
大家可能奇怪,这个图片怎么这么窄啊???
但效果却是???
事实上,当你把一个图片作为背景的时候,DMX会自动的把它排列起来,这样就形成了很长的一段了啊!!大家可以拉拉这个单元格试试,就会明白了!(如果拉了回不来了,可以撤消返回!!)
这个概念比较重要,大家一定要掌握,自己多琢磨琢磨,回味回味,我想应该都能明白的!!
最后那个单元格插入那个尾部的图片就可以了,这个和先前的没什么区别。
看看效果,满意了吧!!
好了,今天就说到这里,虽然做得比较少,但学到的应该还是比较多的,大家慢慢的练习几次,知道熟悉了其中的一些关键操作为止。
9
7
3
1
2
3
4
5
4
8
:
把此文章收藏到:
相关教程
·
在DreamWeaver中编写CSS的一些
·
新手入门篇:J2ME开发环境的安
·
入门:学习网页Web标准的五个步
·
简单描述Adobe Dreamweaver CS
·
用DW制作网页时关于文字自动换
·
玩转 Dreamweaver8.0:速记 CSS
·
jsp入门:初学者对Spring框架的
·
建站入门:明星FANS网站搭建全
·
用Dreamweaver8制作网页中常用
·
通过Dreamweaver设计网页时组织
·
入门:用Dreamweaver简单描述制
·
学习Dreamweaver8了解掌握CSS层
·
绝对简单易学的PHP入门教程
·
用Dreamweaver MX 2004制作ASP
·
入门:AJAX应用需要组件技术作支
广而告之
文章搜索
Google
JZxue.Com
最新文章
网站推广—网站建设的关键课
吸引访客,做内容有价值的网
关于Photoshop直方图的详细
网站策划,B2B网站策划者应
Web标准网站开发人员配备
便宜/廉价的网站推广方式
写给做BBS的新站长
行为经济学在网站运营中的
漫谈网站改版的必要性
网站策划需要具备的知识
外贸网站建设全攻略
CSS让网页更容易设计与维护
和马云学习如何做网站推广
推荐导读
优秀个人网站打造全过程
如何策划网站?
wap建站入门教程
以这种方式做网站肯定会失败
Photoshop用另类方法打造水彩效果
FireWorks教程:DIY树叶笔触画一棵树
用Photoshop制作非主流风格MM秀亮的脸蛋
网站制作过程中把握的几点
Photoshop处理唯美照片效果和边框的制作
使用Fireworks 8制作网页效果图
如何在国外进行域名的注册?
简单的CSS改进网站设计的三个技巧
CSS制作的标准的 非侵入的页签切换效果
热门排行
如何制作网页(网页制作实
如何选择网页制作工具
下载安装Dreamweaver8
制作主页前的准备
垃圾站全教程--之一(新手上
怎样个人网页制作,制作个人
制作模板
在Dreamweaver设置站点
制作首页
网站设计65条原则
规划站点
中国所有银行的BIC code(即
个人主页制作完全手册
关于我们
|
联系我们
|
友情链接
|
网站地图
Copyright © 2005 - 2006
建站学
All rights reserved.