第2章 网页制作基础
Dreamweaver-CS6网页制作第2章

后退
定义在新建样式表文件
结束
2.2使用CSS规则美化文本
(2)单击“确定”按钮,弹出如下图所示的对话框
,定义样式文件名称为“mycss”保存在站点目录
“D:\mysite”文件夹中。
目录
前进
后退
保存新样式表文件“mycss”
结束
2.2使用CSS规则美化文本
(3)单击“保存”按钮,弹出“CSS规则定义”对 话框,保持默认值,单击“确定”按钮。在“属性 ”面板中,定义“title2”样式,大小为“16px”、 目录 颜色为“#960”、“粗体”,效果如下图所示:
中选择“D:\mysite\images\flying.gif”图像文件,
单击“确认”按钮,图像插入后通过标签编辑器将
“对齐”属性设置为“右”。
调整大小:宽度 为215像素,高 度为160像素
前进
后退
设置图像大小
结束
2.3添加图像
(4)使用快捷键插入图象:将插入光标移动到“立
志飞翔”部分的第五段文字“但我”前,使用组合 目录
对话框中选择“D:\mysite\images\flying.gif”图像
文件,单击“确认”按钮,图像插入后通过标签编
辑器将“对齐”属性设置为“左”。
前进
调整大小:宽度 为285像素,高 度为213像素
设置图像大小
后退 结束
2.3添加图像
(3)使用“插入”菜单插入图象:将插入光标移动
到“立志飞翔”部分的第三段文字“听着”前,选 择“插入”栏“常用” 类别中的 按钮,在对话框 目录
达到如图所示的效果,还要对“自我介绍”的内容
后退
制作列表,要在文档中添加水平线,编辑网页的外
网页学习1-2

3. 网站所有文件所要介绍的全部内容做一个类似书籍目录的索引。主页上 的链接对应到一级页面,一级页面里的链接对应于二级页面,依次类推
4. 加入一些交互功能,如留言本、问卷调查、下载、搜索等 设计主页应注意的问题 主页上可供选择的链接不可太少也不可太多,太少会让访问者觉得没有 意思,太多又会吓倒访问者。 主页文件的大小一般不超过200K,否则打开主页的时间过长,会让浏览 者失去耐心的。 主页的在800*600的普通分辨率下应不出现水平滚动条。 主页的风格应与网站中的其他网页一致。
6.Flash Flash是美国Macromedia公司开发的矢量图形编辑和动画创作的专业软件,它是 一种交互式动画设计工具,用它可以将音乐、声效、动画以及富有新意的界面融合 在一起,以制作出高品质的网页动态效果。它主要应用于网页设计和多媒体创作等 领域,功能十分强大和独特,已成为交互式矢量动画的标准,在网上非常流行。 Flash广泛应用于网页动画制作、教学动画演示、网上购物、在线游戏等的制作中。 7.Fireworks Fireworks是由Macromedia公司开发的图形处理工具,它的出现使Web作图发生 了革命性的变化。因为Fireworks是第一套专门为制作网页图形而设计的软件,同时 也是专业的网页图形设计及制作的解决方案。 作为一款为网络设计而开发的图像处理软件,Fireworks还能够自动切割图像、 生成光 标动态感应的JavaScript程序等等,而且Fireworks具有强大的动画功能和 一个相当完美的 网络图像生成器。
2.FrontPage FrontPage是由Microsoft公司推出的新一代Web网页制作工具。FrontPage使网 页制作者能够更加方便、快捷地创建和发布网页,具有直观的网页制作和管理方法, 简化了大量工作。 FrontPage界面与Word、PowerPoint等软件的界面极为相似,为使用者带来了极 大的方便,Microsoft公司将FrontPage封装入Office之中,成为Office家族的一员, 使之功能更为强大。
网页制作基础

常用的WEB图像格式
• GIF(Graphics Interchange Format) –GIF可以用来存储各种图像文件。特别适用 于存储线条、图标和电脑生成的图像、卡 通和其它有大色块的图像。 –GIF文件小,是一种压缩的8位图像文件, 所以最多只支持256种不同的颜色。Gif支 持动态图、透明图和交织图。
HTML
• 文档类型定义
HTML文件结构
–DTD(Document Type Definition) –一组标记(编码:特定文档类型)+内容模型+属 性表
• 文档标记语法
–HTML文档标记语法有文件结构、文本段、组件、多 媒体及动态方式、超级链接等。
• 文本结构语法
–描述文本内容、文件头部、标题、语言字符集、文 本主体、多窗口页面等
网页元素
网页中的元素-声音和视频
• 声音
–不同浏览器对声音文件的处理方法是不同的,彼此之 间很可能不兼容。 –常用的有MIDI、WAV、MP3和AIF等。 –很多浏览器不要插件也可以支持MIDI,WAV和AIF格式的 文件,而MP3和RM格式需要专门的浏览器播放。 –使用声音作为背景音乐—会影响网页下载的速度。 –可以在网页中添加一个打开声音文件的链接,让音乐 播放变得可以控制。
网页元素
网页中的元素-图像
• 图像的作用
–提供信息,展示作品,装饰网页,表达个人情调和风格。
• 图象格式
–GIF、JPEG(JPG)、PNG,使用最广泛的是GIF和JPEG。
• 说明:当使用网页设计软件在网页上添加其他非GIF, JPEG, 或PNG格式的图片并保存时,这些软件通常会 自动将少于8位颜色的图片转化为GIF格式,或将多于 8位颜色的图片转化为JPEG. • 在网页中为了更有效地吸引浏览者的注意,许多网站 的广告都做成了动画形式。
网页制作课程知识点归纳

《网页制作》复习题)第1章网页制作概况网页的概念网页是用HTML(超文本编辑语言)语言编写,通过WWW传播,并被WEB浏览器翻译成为可以显示出来的集文本、超链接、图片、声音和动画、视频等信息元素为一体的页面文件。
网页HTML文件与web浏览器间的关系理参照P5首页和主页的异同点首页与主页的区别:浏览网站时最先访问的页为首页,一般为欢迎信息,通过链接再进入主页(例如:榕树下网站)。
主页是整个网站的导航中心(例如:163网站)。
有些网站首页即主页。
网页制作的常用工具软件有哪些FrontPage、网页制作三剑客(Dreamweaver与Flash、Fireworks并称为Macromedia的网页制作三剑客)、Photoshop ……网页正文区<BODY></BODY>和文件头<HEAD></HEAD>的位置关系,文件头内的唯一一个必须出现的标记是哪一个标记?Title标记HTML文件的基本框架:<HTML>文件开始<HEAD>表头区开始<TITLE>….</TITLE>标题区</HEAD>表头结束<BODY>本文区开始(注:书上写本文区,本人认为应是文本区,待确认)本文区内容(注:书上写本文区,本人认为应是文本区,待确认)</BODY>本文区结束(注:书上写本文区,本人认为应是文本区,待确认)</HEML>文件结束单标记和双标记的概念,HTML标记中哪些是单标记,哪些是双标记?P5起单标记指令(由<标记指令>构成),如:<p>、<Hn>、<Br>、<Hr>、<input>、<link>……双标记指令(由<起始标记></结束标记>构成),如:< HEAD > </ HEAD >……注释语句的含义,其正确书写格式HTML标记的常用属性的含义,例如大小尺寸、对齐方式、颜色值属性的书写方式在HTML 文件中实现换段和强制换行的不同,及分别使用哪个标记段落标记(<P></P>)与换行标记(<br>)<P>是HTML格式中特有的段落元素。
中职培训《网页制作基础》教案陶德松

中职培训《网页制作基础》教案-陶德松第一章:网页制作概述1.1 课程目标了解网页制作的基本概念和流程掌握网页制作的基本工具和技能1.2 教学内容网页制作的定义和作用网页制作的基本流程网页制作的基本工具(如HTML、CSS、Dreamweaver等)1.3 教学方法讲解法:讲解网页制作的基本概念和流程演示法:演示网页制作的基本工具和技能1.4 教学资源教学PPT网页制作工具软件1.5 教学评价课堂练习:制作简单的网页第二章:HTML基础2.1 课程目标掌握HTML的基本结构和语法学会使用HTML标签创建网页元素2.2 教学内容HTML的基本结构常用HTML标签及其功能网页布局和排版2.3 教学方法讲解法:讲解HTML的基本结构和语法演示法:演示如何使用HTML标签创建网页元素2.4 教学资源教学PPTHTML编写软件(如Sublime Text、Visual Studio Code等)2.5 教学评价课堂练习:使用HTML编写简单的网页第三章:CSS样式3.1 课程目标掌握CSS的基本语法和用法学会使用CSS样式美化网页3.2 教学内容CSS的基本语法和用法选择器和伪选择器常用CSS属性和值响应式设计和移动端优化3.3 教学方法讲解法:讲解CSS的基本语法和用法演示法:演示如何使用CSS样式美化网页3.4 教学资源教学PPTCSS编辑软件(如Sublime Text、Visual Studio Code等)3.5 教学评价课堂练习:使用CSS样式美化网页第四章:网页布局和排版4.1 课程目标掌握网页布局和排版的方法和技巧学会使用CSS框架和响应式设计4.2 教学内容网页布局的基本方法(如固定布局、百分比布局、弹性布局等)排版的基本方法(如字体、颜色、对齐等)CSS框架的使用(如Bootstrap、Foundation等)响应式设计和移动端优化4.3 教学方法讲解法:讲解网页布局和排版的方法和技巧演示法:演示如何使用CSS框架和响应式设计4.4 教学资源教学PPTCSS框架和响应式设计软件4.5 教学评价课堂练习:使用CSS框架和响应式设计进行网页布局和排版第五章:网页制作实践5.1 课程目标掌握网页制作的基本流程和方法能够独立完成一个完整的网页制作项目5.2 教学内容网页制作的基本流程(需求分析、设计、编码、测试等)网页制作的方法和技巧(如布局、排版、样式等)实际操作:完成一个完整的网页制作项目5.3 教学方法讲解法:讲解网页制作的基本流程和方法演示法:演示如何完成一个完整的网页制作项目5.4 教学资源教学PPT网页制作工具软件5.5 教学评价课堂练习:独立完成一个完整的网页制作项目第六章:图像和多媒体元素6.1 课程目标掌握如何在网页中使用图像和多媒体元素学会使用CSS对图像和多媒体元素进行样式设置6.2 教学内容网页中图像和多媒体元素的基本使用方法图像和多媒体元素的HTML标签(如img, audio, video等)CSS样式对图像和多媒体元素的影响(如宽度、高度、边距等)6.3 教学方法讲解法:讲解如何在网页中使用图像和多媒体元素演示法:演示如何使用CSS对图像和多媒体元素进行样式设置6.4 教学资源教学PPTHTML和CSS编辑软件6.5 教学评价课堂练习:在网页中添加并样式设置图像和多媒体元素第七章:表单和交互式元素7.1 课程目标掌握如何在网页中创建和使用表单学会使用CSS对表单进行样式设置7.2 教学内容表单的基本使用方法表单的HTML标签(如form, input, select, textarea等)CSS样式对表单的影响(如边框、背景、颜色等)7.3 教学方法讲解法:讲解如何在网页中创建和使用表单演示法:演示如何使用CSS对表单进行样式设置7.4 教学资源教学PPTHTML和CSS编辑软件7.5 教学评价课堂练习:创建一个简单的表单并在网页中进行样式设置第八章:网页动画和过渡效果8.1 课程目标掌握如何为网页元素添加动画和过渡效果学会使用CSS动画和过渡效果8.2 教学内容网页动画和过渡效果的基本概念CSS动画和过渡效果的语法和用法常用的CSS动画和过渡效果属性(如animation-duration, transition-property等)8.3 教学方法讲解法:讲解网页动画和过渡效果的基本概念演示法:演示如何使用CSS动画和过渡效果8.4 教学资源教学PPTHTML和CSS编辑软件8.5 教学评价课堂练习:为网页元素添加动画和过渡效果第九章:网页兼容性和优化9.1 课程目标掌握网页兼容性和优化的方法和技巧学会使用浏览器兼容性检查工具和优化策略9.2 教学内容网页兼容性问题及其原因浏览器兼容性检查工具(如BrowserStack、Google Developers)优化网页性能的方法(如减少请求、压缩资源等)9.3 教学方法讲解法:讲解网页兼容性和优化的方法和技巧演示法:演示如何使用浏览器兼容性检查工具和优化策略9.4 教学资源教学PPT浏览器兼容性检查工具和优化策略软件9.5 教学评价课堂练习:对一个网页进行兼容性和优化第十章:网页制作项目实战10.1 课程目标掌握网页制作项目的基本流程和方法能够独立完成一个复杂的网页制作项目10.2 教学内容网页制作项目的基本流程(需求分析、设计、编码、测试、发布等)网页制作的方法和技巧(如布局、排版、样式等)实际操作:完成一个复杂的网页制作项目10.3 教学方法讲解法:讲解网页制作项目的基本流程和方法演示法:演示如何完成一个复杂的网页制作项目10.4 教学资源教学PPT网页制作工具软件10.5 教学评价课堂练习:独立完成一个复杂的网页制作项目第十一章:JavaScript基础11.1 课程目标掌握JavaScript的基本语法和用法学会使用JavaScript实现简单的交互功能11.2 教学内容JavaScript的基本语法和用法变量、数据类型和运算符控制结构(如if语句、循环等)函数和事件处理11.3 教学方法讲解法:讲解JavaScript的基本语法和用法演示法:演示如何使用JavaScript实现简单的交互功能11.4 教学资源教学PPTJavaScript编辑软件(如Sublime Text、Visual Studio Code等)11.5 教学评价课堂练习:使用JavaScript实现简单的交互功能第十二章:JavaScript进阶12.1 课程目标掌握JavaScript的高级概念和用法学会使用JavaScript框架和库12.2 教学内容高级概念(如闭包、原型链等)异步编程(如Promise、async/awt等)JavaScript框架和库(如React、Angular、Vue等)浏览器API的使用(如DOM操作、地理位置等)12.3 教学方法讲解法:讲解JavaScript的高级概念和用法演示法:演示如何使用JavaScript框架和库12.4 教学资源教学PPTJavaScript框架和库的官方文档12.5 教学评价课堂练习:使用JavaScript框架和库实现复杂的交互功能第十三章:前端工程化和自动化13.1 课程目标掌握前端工程化和自动化的方法和技巧学会使用前端构建工具和任务管理器13.2 教学内容前端工程化的概念和流程前端构建工具(如Webpack、Gulp、Grunt等)任务管理器(如npm scripts、Lerna等)代码质量和规范(如ESLint、Prettier等)13.3 教学方法讲解法:讲解前端工程化和自动化的方法和技巧演示法:演示如何使用前端构建工具和任务管理器13.4 教学资源教学PPT前端构建工具和任务管理器的软件13.5 教学评价课堂练习:使用前端构建工具和任务管理器进行项目构建和自动化第十四章:响应式网页设计14.1 课程目标掌握响应式网页设计的原则和方法学会使用CSS媒体查询和框架进行响应式设计14.2 教学内容响应式网页设计的原则和概念CSS媒体查询的使用响应式设计的框架(如Bootstrap、Foundation等)移动端优化的方法和技巧14.3 教学方法讲解法:讲解响应式网页设计的原则和方法演示法:演示如何使用CSS媒体查询和框架进行响应式设计14.4 教学资源教学PPTCSS媒体查询和响应式设计框架的软件14.5 教学评价课堂练习:使用CSS媒体查询和响应式设计框架进行响应式网页设计第十五章:项目实战与答辩15.1 课程目标掌握项目实战的基本流程和方法学会进行项目答辩和展示15.2 教学内容项目实战的基本流程(需求分析、设计、编码、测试、部署等)项目答辩和展示的方法和技巧实际操作:完成一个项目并进行答辩和展示15.3 教学方法讲解法:讲解项目实战的基本流程和方法演示法:演示如何进行项目答辩和展示15.4 教学资源教学PPT项目实战和答辩的软件15.5 教学评价课堂练习:完成一个项目并进行答辩和展示重点和难点解析本文主要介绍了中职培训《网页制作基础》教案-陶德松,共分为十五个章节。
《新编网页制作三剑客培训教程》课件第2章

2.1 表格及操作表格的方式 2.2 利用表格的标准模式规划网页 2.3 利用表格的布局模式规划网页 2.4 上 机 实 训
第2章 使用表格规划网页
随着网络带宽的不断加大,人们已经不满足于由大量文字和少量图片内容构成的网页,而是更加热衷于多媒体网页,如:各种音乐网站、电影网站,以及实时的音、视频信息网站等。
2.4 上 机 实 训
1. 实训目的
创建一个名为“2-4.html”的网页。要求:实现最基本的网页布局效果,如图2-38所示。通过该实训练习,进一步熟练掌握表格标准模式的具体操作过程。本实训最终效果文件见“站点实例”(WebDemo\ch2\2-4.html)。
2.2.2 选择表格和单元格
2. 选择单个或多个行或列 将光标移动到表格的左边框或上边框,当光标变为“选择箭头”图标时,如图2-7所示,单击可以选择单个行或列,拖动鼠标可以选择多个行或列。
图2-7 “选择箭头”图标
2.2.2 选择表格和单元格
3. 选择单个单元格 选择单个单元格,可以执行下列操作之一。 将光标定位在目标单元格,然后在【文档】窗口左下角的【标签选择器】中选择【<td>】标签。 按<Ctrl>键,单击该单元格。 4. 选择多个单元格 选择多个单元格,可以执行下列操作之一。 从一个单元格拖拽(按左键不松开)到其他单元格。 将光标定位在目标单元格,然后按<Ctrl>键单击该单元格,接着按<Shift>键单击另一个单元格。这两个单元格定义的直线或矩形区域中的所有单元格都将被选中。 将光标定位在任意单元格,然后在菜单栏中选择【编辑】→【全选】命令(或按<Ctrl>+<A>组合键),即可选中所有单元格。
网页制作课件ppt

SEO基本原则
关键词研究、内容质量、 网站结构、外部链接和内 部链接等。
网站优化技巧
页面加载速度
优化图片、压缩代码、使 用CDN等方式提高页面加 载速度。
移动端优化
确保网站在移动设备上显 示良好,提高用户体验。
响应式设计
使网站能够适应不同设备 和屏幕尺寸,提供一致的 用户体验。
网站推广策略
关键词广告 社交媒体营销
内容营销 合作与交换链接
利用搜索引擎关键词广告推广网站。
通过社交媒体平台发布有价值的内容,吸引目标受众。 创建高质量、有价值的文章、视频等,吸引潜在客户并提高品
牌知名度。 与其他网站合作,互相推广,增加网站流量。
06 网页制作实例教 程
制作个人网站
总结词
展示个人风格和兴趣
字体选择
选择清晰易读的字体,确保文字内容 在各种设备和屏幕分辨率上都能清晰 显示。
03 网页布局与设计
网页布局的基本原则
保持简洁
避免页面过于拥挤,突出核心内容,使用户 能够快速找到所需信息。
导航清晰
提供易于理解的导航菜单,使用户能够方便 地浏览不同页面。
层次分明
合理划分页面区域,使内容按照重要程度进 行排序,提高用户体验。
制作电商网站
总结词
商品展示与销售
详细描述
电商网站是商品展示和销售的重要平台,需要展示丰 富的商品信息和购物体验。在制作电商网站时,需要 考虑如何设计出美观、实用的商品展示页面,以及如 何提供便捷的购物流程和支付方式。
制作电商网站
总结词
用户友好性
详细描述
电商网站应该具有用户友好性,提供良好的 用户体验和购物体验。在制作电商网站时, 需要考虑如何设计出易于操作和使用的界面 和功能,以及如何提供个性化的服务和支持
网页设计与制作知识点整理总结

第1章网页设计概述1.1 Internet 与WWW1.1.1 InternetInternet,译为“因特网”,又叫做“国际互联网”。
Internet 为用户提供了多种服务:•万维网服务(WWW)•电子邮件服务(E-mail )•远程登录服务(Telnet )•文件传输服务(FTP)1.1.2 WWWWWW,是“World Wide Web”的缩写,简称Web,译为“万维网”。
WWW 是运行在Internet 之上的超文本信息浏览系统。
WWW 的核心部分由三个标准构成:HTML / URL / HTTP1.HTML:超文本标记语言,用于定义超文本文档(网页)的结构。
2.URL:统一资源定位符,用于标识万维网上信息资源的地址(网址)。
3.HTTP:超文本传输协议,是客户端浏览器与Web 服务器之间的通信协议。
1.1.3 W3C万维网联盟(World Wide Web Consortium,W3C),又称W3C 理事会。
W3C 致力于对web 进行标准化。
W3C 制定了包括XHTML 和CSS 等众多影响深远的标准规范。
1.2 网页设计1.2.1 网页网页是用超文本标记语言HTML 书写的一种纯文本文件。
网页需要通过浏览器对其进行解释,才生成包含文字、图像、声音、视频和动画等多媒体信息的页面。
1.2.2 网页的类型静态网页:网页内容固定不变。
文件扩展名是.htm 或.html。
动态网页:网页内容由服务器端运行的程序动态生成。
文件扩展名是.aspx、.jsp、.php等。
1.2.3 网页布局设计按页面大小划分,网页布局分为:•固定宽度布局(常见的网页宽度是780px,或1000px)•可变宽度布局(常见的网页宽度是屏幕的100%)按页面版式划分,网页布局分为:•单栏布局•两栏布局•三栏布局•多栏布局•变化布局1.3 服务器与浏览器1.3.1 Web 服务器Web 服务器也称为WWW 服务器,主要功能是提供超文本信息浏览服务。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
1、插入工具栏 “插入”工具栏位于菜单栏下方,集成了所有 可以在网页应用的对象,包括了“插入”菜单中的 选项。如下图所示:
显示或隐藏插入工具栏的方式: 选择菜单【查看】|【工具栏】|【插入】 选项 选择菜单【窗口】|【插入】 选项
目 录 上一页 下一页 退 出
2、文档工具栏 “文档”工具栏包含一些对文档进行操作的常用按钮。
目 录 退 出
1、面板的基本操作 1 打开和关闭面板:面板可以通过“窗口”菜单对应 的选项来打开。如果需要关闭面板则可右键点击面板 选择弹出菜单的“关闭面板组”选项。 显示和隐藏面板: 【查看】|【隐藏面板】命令来隐藏所有已打开的 面板。
目 录 上一页 下一页 退 出
说明:显示面板操作和隐藏面板方式相同。 2、属性面板 默认情况下,“属性”面板位于工作区的底部, 属性”面板显示的内容是随当前在文档中选择的对象 来确定的。
目 录 上一页 下一页
单标记表示一种功能,没有范围之分。 语法格式为: <标记>
双标记包括开始标记和结束标记符,定义了标记符 退 出 影响的范围。 语法格式为: <标记>内容<标记>。 包含属性的标记,作用是对标记影响的内容进行更 详细的控制。标记属性可以由用户设置,否则采用默 认值。属性出现在标记的后面,并且以空格进行分隔。 如果标记有多个属性,不同属性名称之间也以空格隔 开。 格式:<标记名字 属性1 属性2 属性3 ……>
2.3 HTML设计基础
目 录 上一页 下一页 退 出
2.3.1 什么是HTML 2.3.2 HTML中的常用标记
2.3.1 什么是HTML
目 录 上一页 下一页 退 出
HTML(HyperText Markup Language)即超 文 本 标记语言或超文本链接标示语言,是构成网页文档的 主要语言。 HTML 用 于 描 述 功 能 的 符 号 称 为 “ 标 记 ” , 如 “HTML”、“BODY”、“TABLE”等。HTML标记可以 说明文字、图形、动画、声音、表格、链接等。HTML 标记通常是英文词汇的全称(如头部:head)或缩略 语(如“p”代表Paragraph),均用尖括号括起来。 如Paragragh标记是<p>,头部标记是<head>。 HTML标记用于描述、设置网页文件的内容及格式。 用户只需要输入文件内容和必要的标记,文件内容就 能在浏览器中按照标记定义的格式显示出来。
目 录 上一页 下一页 退 出
3、创建文件夹 “文件”面板中右键单击根文件夹,在弹出的 快捷菜单中选择“新建文件夹”命令。 4、创建文件 “文件”面板中右键单击根文件夹,在弹出的 快捷菜单中选择“新建文件”命令。 5、文件与文件夹的管理 对建立好的文件和文件夹,可以进行移动、复 制、重命名和删除等基本的管理操作。在“文件” 面板中右键单击需要操作的文件或文件夹,从弹出 的快捷菜单中选“编辑”选项,即可进行相关操作。
目 录 上一页 下一页 退 出
3、标准工具栏 “标准”工具栏包含来自“文件”和“编辑”菜单中的一般 操作的按钮 ,可以通过【查看】|【工具栏】|【标准】命令来显示或
隐藏。
2.1.4 Dreamweaver 8常用面板
面板集合了网页设计过程需要用到的各类功能, 上一页 并根据功能被分为了若干组。在工作区窗口底部有个 “属性”面板,而窗口右边为“应用程序”、 下一页 “CSS”、“标签检查器”和“文件”等面板。
(6)站点定义总结,单击“完成”按钮就定义好一
个站点了。定义好后文件面板中会显示刚才定义的 站点。
目 录 上一页 下一页 退 出
2、管理站点 (1)编辑站点 编辑站点即修改已建好站点的属性和参数,可 菜单栏中选择【站点】|【管理站点】命令, (2)删除站点 在“管理站点”对话框中选择要删除的站点, 然后单击“删除”按钮即可。 (3)复制站点 在“管理站点”对话框中选择要复制的源站点, 再单击“复制”按钮,就可生成一个和源站点相同 的新站点。
2.1.1 Dreamweaver 8简介
目 录 上一页 下一页 退 出
Dreamweaver 8是美国Macromedia公司开发的集网 页制作和管理网站于一身的所见即所得网页编辑器, 具有可视化、支持多平台和跨浏览器的特性,是目前 网站设计、开发、制作的首选工具。
2.1.2 Dreamweaver 8工作界面
目 录 (7)<FONT>字体 上一页 退 出
Face:设定文字的字形,建议不要使用 下一页 “Windows"内建字体以外的字形 Size:设定文字大小,其值可以是绝对或相对。 不受<BASEFONT>影响。内定为3 Color:字体颜色 (8)<OL>称为顺序清单标记 所谓顺序清单就是在每一项前面加上1,2,3,…等 数,又称为编引清单。 (9)<UL>无序清单标记,如:<ul type="square">
显示或隐藏“属性”面板,可以通过选择【窗 口】eamweaver 8 本地站点的建立与管理
目 录 上一页 下一页 退 出
2.2.1定义和管理本地站点 2.2.2 站点目录结构的建立和管理
2.2.1定义和管理本地站点
目 录 上一页 下一页 退 出
1、创建站点 步骤: (1)选择菜单栏中的【站点】|【管理站点】命令。 (2)在“站点定义”对话框中选择默认的“基本” 选项卡。 (3)设置是否要使用服务器技术。选择“否,我不 想使用服务器技术”表示建立一个静态站点。 (4)设置文件存储位置。 (5)设置如何使用远程服务器对话框。目前暂不使 用,所以选择“无”。
2.3.2 HTML中的常用标记
目 录 上一页 下一页 退 出
HTML的结构包括3个部分:起始标记、网页标题 (Head)和文件主体(Body)。 标题夹在<head>和</head>标记之间,用于描述 网页标题及属性。正文即文件主体在<body>和 </body>之间是HTML的主要部分,它包括了文件所有 </body> HTML 的实际内容和绝大多数标记符号。 1、标记的基本格式 HTML标记用“<>”括起来,通常成对出现,无斜 杠的标记表示该标记的作用开始,有斜杠的标记表示 该标记的作用结束。
目 录 上一页 下一页 退 出
1、文件命名规则 最好用英文或者汉语拼音命名。文件多的时候可 以和数字、符号组合使用。不能使用中文命名。 最好使用小写字母,因为有些操作系统(如UNIX) 对大小写敏感。 文件和文件夹的名称可以使用下划线“_”,但 是不能使用空格、特殊符号以及“~”、“!”、 “@”、“#”、“$”、“%”、“^”、“&”、 “*”等符号。名字不要过长。 2、目录结构 根据站点规划的内容确定所需要的的文件夹。可 以给每个板块建立一个文件夹,这样可以让制作者 保持清晰的设计思路。建立站点目录结构层次越少 越容易管理和访问。
目 录 上一页 下一页 退 出
(4)导入和导出站点 ①导出站点: “管理站点”对话框中选择要 导出的一个或多个站点,然后单击“导出”按 钮。 ②导入站点:若要导入站点在“管理站点” 对话框中单击“导入”按钮,出现“导入站点” 对话框。找到要导入的站点文件单击“打开” 按钮即可。
2.2.2 站点目录结构的建立和管理
目 录 上一页 下一页 退 出
2、常用标记 (1)<HTML>……</HTML>:整份文件处于标记 <HTML>与</HTML>之间 (2)<HEAD>:由<HEAD>至</HEAD>称为开 头 (3)<TITLE>:只可出现开头部分,所标示的是 文件的标题 (4)<BODY>:<BODY>至</BODY>称文本 (5)<P>常用数,如:<p align=“center”> (6)<HR>水平线
第二章 网页制作基础
制作:杜丽君
目录
目 录 上一页 下一页 退 出
2.1 2.2 2.3
Dreamweaver 8基础知识 基础知识 Dreamweaver 8 本地站点的建立与管理 HTML设计基础 设计基础
2.1
目 录 上一页 下一页 退 出
Dreamweaver 8基础知识
2.1.1 Dreamweaver 8简介 简介 2.1.2 Dreamweaver 8工作界面 工作界面 2.1.3 Dreamweaver 8 常用工具栏 2.1.4 Dreamweaver 8常用面板 常用面板
目 录 上一页 下一页 退 出
(10)<TABLE>是一个容器标记,意思是说它用 以声明这是表格而且其他表格标记只能在它范 围内才适用。 (11)<IMG>图形标记 (12)<marquee>滚动代码 (13)<embed>FLASH代码 (14)<bgsound>背景音乐
目 录 上一页 下一页 退 出
标题栏 文档工具栏 菜单栏 工具栏 面板组
Dreamweaver8的标准工作界面包括:标题栏、菜 单栏、插入面板组、文档工具栏、标准工具栏、文档 窗口、状态栏、属性面板和浮动面板组。如下图所示
标 签 选 择
标尺 文档窗口 属性面板 文件面板
状态栏
2.1.3 Dreamweaver 8 常用工具栏