Adobe dreamweaver CS6小白入门教程

您所在的位置:网站首页 dreamweaver菜单栏细节讲解 Adobe dreamweaver CS6小白入门教程

Adobe dreamweaver CS6小白入门教程

2023-12-15 17:15| 来源: 网络整理| 查看: 265

1.界面认识2.创建站点:(针对复杂网站使用)3.管理站点的操作:4.管理站点中的文件5.DW文本网页的设计6.DW图像和多媒体网页设计7.超链接8.表格(重要)来排版9利用APDIV和spry灵活布局10.用CSS修饰美化网页11.用模板和库(提高网页制作效率)12.用表单创建交互式网页13.使用行为和js代码14.网站页面布局设计与色彩搭配的讲解

0.首先一点答疑

用dreamweaver制作图片切换效果_百度经验 https://jingyan.baidu.com/article/7c6fb4287f8b3580652c906d.html

dw中多张图片代码_百度经验 https://jingyan.baidu.com/article/d621e8da22b3712865913f11.html

1.界面认识 2.创建站点:(针对复杂网站使用)

站点是一系列文档的组合,这些文档通过各种链接建立逻辑关联。是管理网页文档场所。 DWCS6是一个站点创建和管理工具,使用它不仅可以创建单独文档,还可以创建完整的站点。 创建网页:新建。

3.管理站点的操作:

打开站点、 编辑站点、 删除站点、 复制站点、 导入导出站点

4.管理站点中的文件

1.创建文件夹和文件 2.复制移动文件 3.站点地图:以树形结构图方式显示站点中文件的连接关系。在站点地图中添加、修改、删除文件间链接关系。

5.DW文本网页的设计

5.1确定网页页面的属性 5.1.1如何写入连续多个空格?导航栏->编辑->首选参数,这里有很多操作可以自行.. 这里写图片描述 5.1.2直接插入多个连续空格 这里写图片描述

5.1.3设置是否显示不可见元素

视图中有一些元素仅用来标志元素的位置而在浏览器中是不可见, 最常用的有换行符、脚本、表单,网页中添加换行符不能按“回车键”而是shift+enter//等于代码中的

这里写图片描述 5.1.4其他设置: 在属性面板中单击 页边距什么的.. 5.2在网页中插入各种元素 5.2.1.插入–HTML–特殊字符 5.2.2.查看–网格设置/ 标尺… 5.2.3.创建/修改项目列表和编号列表 5.3插入网页头部内容 位置:插入–HTML–文件头标签–Meta/关键字… 5.3.1.设置meta:该对象来插入一些为Web服务器提供选项的标记符。 5.3.2.插入关键字:网络搜索引擎准备关键字一般要尽可能概括网页内容。 5.3.3.插入说明:设计者对网页内容详细说明 5.3.4.插入刷新:设置网页自动刷新 5.3.5注意。这个通道中的“链接”是“当前网页和本站点中的另一网页之间的关系” 5.3.6.注意。不是这个通道中的每一项操作都会在网页界面中显示,但会在代码中显示,(也就是“设置不可见元素”)比如: 这里写图片描述

6.DW图像和多媒体网页设计

6.1图像 6.1.1网页中3种常见图像格式: GIF 网络最常见,可制作动态图像,通性好。 JPEG 丰富色彩,下载速度快 PNG 专门为网络准备的图像格式,通用性差。 6.1.2.给图像添加文字说明 6.1.3插入图像占位符(替换) 6.1.4跟踪图像(没听懂…) (以上视频传送门http://www.rjzxw.com/se-13645-112.html) 6.2多媒体 插入多媒体要以牺牲速度、兼容性等为代价,所以不会太多,一般在网页中插入2-3个。 1.常见: 插入SWF(shock wave flash)动画:提供使用flash对象的功能 插入FLV视频 插入shockwave影片 插入Applet:可以嵌入WED页面的轻量级应用程序的编程语言 2.音频: 在代码输入下实现

//bgsound音频背景 src链接文件 loop音量 7.超链接

7.1.创建 注意::必须将链接网址和当前网页放在同一个文件夹中((点击属性–链接后的文件夹按钮–选择网页 7.2.下载文件超链接:在网页中提供资料来下载,就需要为文件下载链接。如果超链接指向的不是一个网页文件,而是其他文件。 (单击链接后的文件夹按钮–选择文件) ps:岂不是本地不能删?????? 7.3.电子邮件链接:让浏览者把网站内容以邮件形式发送出去 (插入–电子邮件链接–输入显示的文本和目的地址(预览会发现,点击将自动打开个人邮箱软件) 7.4.脚本链接 执行js代码或者调用js函数,很实用。 能在不离开当前网页文档的情况下,为访问者提供信息,和其他。 输入函数 这里写图片描述 预览 这里写图片描述 7.5.空链接 用于访问向页面上的对象或者文本附加行为。 (属性–链接后输入“#”) 7.6管理超链接 7.6.1.自动更新链接: 编辑–首选参数–分类–常规 这里写图片描述 7.6.2.在站点范围内更改链接 7.6.3.检查站点中的链接错误 这里写图片描述

8.表格(重要)来排版

8.1.复杂表格必须通过代码来写 < table >表格的开始和结束 < tr >表格的行 < td >表格内的数据 < caption > 表格的标题 < th >表格列名 ps:他是咋实现先选中区域再创建表格的??????以下是解答吧 8.2.设置表格和各个元素的属性 8.3.导入、导出数据 插入–表格对象–导入数据 文件–导出–表格 命令–排序表格

9利用APDIV和spry灵活布局

9.1.APDiv的概念:是网页的容器元素,不仅可以放置图像,还可以放置文字、表单、插件等。 9.1.1创建嵌套APDiv(子与父的关系) 插入–布局对象–AP Div 9.1.2.隐藏所有APDiv标签 查看–可视化助理–隐藏所有 9.1.3.性质以及多个层同时操作 可在右侧工具栏AP元素中选中多个层。 修改–排列顺序–可修改高度、对齐等 9.1.4层靠齐到网格 查看–网格设置–靠齐到网格 9.1.5关于网格:显示–“线”有时会比较突出甚至阻挡画面,因此可选择“点”。 这里写图片描述 9.2设置APDiv的属性 在属性面板和AP元素面板中 9.2.1设置APDiv显示/隐藏属性 这里写图片描述 9.2.2.改变APDiv堆叠顺序(见上图Z) 在AP元素面板中的Z轴属性值更改,层的显示顺序与Z轴顺序一致,Z值越大,层位置越靠上前。也可以拖拽实现。 9.2.3.添加APDIV**滚动条**

这里写图片描述 解释: 溢出:AP元素面板中溢出用于控制当AP元素的内容超出AP元素的指定大小时如何在浏览器显示AP元素。的显示方法。 visible可见(部分内容):hidden隐藏(部分内容):sceoll**滚动条**:auto超出范围的滚动条 左、上是距离页面边界的距离! 宽、高是APDiv大小 Z轴是顺序 背景也是针对APDiv的! 这里写图片描述 default默认 inherit继承 visible、hidden是否可见 9.3应用层设计表格(APDiv和表格的转换:修改–转换) 9.4使用spry布局网页对象(插入–布局对象–spry菜单栏) Spry框架支持一组标准html、CSS、JavaScript编写可重用构件, 设置构件样式: 这里写图片描述 9.4.1.使用Spry菜单栏:一组可导航的菜单按钮 9.4.2.使用Spry选项卡式面板:显示或隐藏存储在选项卡式面板中内容 9.4.3.使用Spry折叠式 9.4.4.使用Spry折叠面板(只针对一个导航项) 9.5利用APDiv制作网页下拉菜单 先新建一个APDiv,确定合适的位置,插入表格(宽度100% 间距…),填好文字 选中导航栏的一个小格子,窗口–行为–“+”来建立导航栏和下拉菜单的关系 (显示–over ;隐藏–out)

10.用CSS修饰美化网页

10.1介绍 这里写图片描述 这里写图片描述

then,代码,还是代码.....

10.2使用CSS样式 10.2.1.CSS样式控制面板(新建CSS规则(以上图)、编辑样式、删除CSS规则、附加样式表) 10.2.2样式的类型与创建 这里写图片描述 第3.4.点如图↓↓:第一种应用方法 这里写图片描述 或者第二种应用方法↓↓: 这里写图片描述 末:创建外部样式(新建CSS规则–规则定义选择“新建样式表文件而不是仅本”)那么如何引用外部样式呢?就在“附加样式表” 这里写图片描述 10.2.3.编辑CSS样式操作 这里写图片描述 详细介绍 http://www.rjzxw.com/se-13895-112.html 区块:网页间距、对齐方式、文字间距、缩进等。 方框:表格中的单元格的性质。 列表:设定项目符号和编号的外观。 定位:精确控制网页元素的位置,主要是层。(Position类型) 拓展:4.0及以上版本 过渡:动画 这里写图片描述 空链接的做法 10.3 CSS过滤器(分静态、动态) 这里写图片描述 10.3.1滤镜:对CSS的扩展 这里写图片描述 光晕Glow 模糊 Blur 遮罩mask (实现一种颜色框架效果) 10.3.2 CSS滤镜设计特殊文字 透明色chroma 阴影dropshadow 波浪wave X射线Xray 10.4应用CSS改变文本间行距 这里写图片描述 10.5应用CSS给文字添加边框 这里写图片描述

ps:无论哪个CSS新规则定义,都要先选定字体、字号等基本类型,

11.用模板和库(提高网页制作效率)

11.1模板就是文档拓展名 dwt 并存放在根目录下的“templates”子文件夹中。 11.2: 创建一个模板 这里写图片描述 编辑模板 这里写图片描述 定义可编辑(插入–模板对象–可编辑区域

12.用表单创建交互式网页 13.使用行为和js代码 14.网站页面布局设计与色彩搭配的讲解

略 友情传送门:Dreamweaver CS6视频教程http://www.rjzxw.com/jc-112-1.html



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3