网页设计课件.pptxVIP

教学项目一 网页设计概述; ;首页; 11、超文本传输协议HTTP(Hypertext Transfer protocol) 万维网中传输HTML文件时使用的协议;;12、URL（Unitorm Resource Locator）统一资源定位符 定位Intenet中存在的资源的标识符: Protocol：// Host.domain：port path/filename ftp 主机名称 端口号 http 网络资源路径及文件名称 mailto 例如： ftp：///public/en.rar http：///index.htm mailto：XGZYLJJ@163.net file：//private/pub/1.htm port号通常省略；; ;2、制作阶段 网页设计、测试、网页上传;3、维护阶段 内容更新 ? ;5、网站制作的相关建议 ①多浏览，参考 ②声音，动画，颜色的和谐配合 ③交互性设计 ④创新意识 ? ;6、网页设计的相关软件简介 Frontpage、Dreamweaver、Flash、Fireworks、Photoshop、Cool 3D、VbScript、 JavaScript、ASP、HTML等；;;;;1、建立空站点;案例设计：在Frontpage中通过导入功能，查看导入的网页效果;（二）;（三）;（四）;（五）;3、通过向导建立站点;? ? 网页的新建，保存，预览，关闭，打开 ? ? 字体，标题级，颜色效果设定 ? 表格 ? 水平线 ? 背景颜色设置 ;案例设计一：制作课程表;;;案例四、个人音乐网站;一、案例设计 个人音乐网站;二、图片的处理;降低对比度： 增加减低亮度： 剪裁：对图像进行剪裁 设置透明的颜色：将图像中某种颜色变成透明色 黑白模式：彩色图像转换为黑色图像 淡化：图像的颜色进行淡化 凹凸效果：图像变为3D图像;案例设计二：图片的常见处理;案例设计三： 图片的分块链接;(三) 在主页插入表格，在单元格中插入图片，设定超级链，在各子网页中设计返回 主页效果如下，在不同单元格图片上单击时，可以打开相应的超级链接 ;;;;;;;案例设计四： 图片热区链接的网页 ;步骤：（一）设计站点，并设计网页jiaoyou.htm ;(二)在jiaoyou.htm中将图片中的文字进入和注册区域设定矩形热区链接与圆形区域链接。单击进入时，打开jin.htm,单击注册时，打开zhuce.htm;;;;;;; ;;;;;;制作网上星缘网页 ;制作网上鲜花店网页 ;;一、表单的设计 （一）表单中的基本元素介绍 1．单行文本框 2．值域 3．滚动文本框 4???单选按钮 5．复选框 6．一般铵钮 7．下拉菜单 ; ;案例设计二: 留言板信息表单网页设计;二、超级链接的综合使用 1.链接到文件（图片文件、声音文件等） 2.链接到万维网 3.链接到电子邮件地址 4.链接到书签;;功能分析： 本案例是一个框架综合应用的例子。框架结构为上，左，右。?; ;;;;一．案例分析： HTML Head title我的个人网页/title /head body p欢迎光临我的个人网站 /body /html;网页效果如下：; ;3．title/title 浏览器窗口最上边显示的文本信息，只能放在head/head标志对之间 4.body/body 是HTML文档的主体部分，用于设定网页背景色，背景图，文本颜色，超级链接颜色以及使用过的超级链接颜色等。 主要属性：bgcolor、text、 link、 vlink、 alink ;Bgcolor: 设定页面背景的颜色 Text: 设定页面文字的颜色 Link: 设定页面默认的链接颜色 Alink: 设定鼠标单击时的链接的颜色 Vlink: 设定访问过后的链接的颜色;;;;;;例:html head title一个普通的列表/title/head body text=blue dl dt中国城市/dt dd北京/dd dd上海/dd dd深圳/dd dt美国城市/dt dd华盛顿/dd dd纽约/dd dd芝加哥/dd /dl /body /html ;;4.ol/olul/ulli/li ol/ol创建一个标有顺序号的列表 ul/ul创建一个标有圆点的列表 li/li用来创建一个列表项;无序列表的类型属性type: Type=disc ? Type=circle ? Type=square ?;例: html head title有序列表的使用/title body te