1 / 25

用 FrontPage 制作个人主页

用 FrontPage 制作个人主页. 用 FrontPage 制作个人主页的基本流程. 新建个人网站 设计主页功能模块 表格或框架规划主页 设计普通网页 添加网页元素 插入活动元素 设计超链接 美化页面 运用表单 管理网站. 创建和编辑网站 使用向导创建各种站点. 用 FrontPage 制作个人主页的基本流程. 新建个人网站 设计主页功能模块 表格或框架规划主页 设计普通网页 添加网页元素 插入活动元素 设计超链接 美化页面 运用表单 管理网站. 用 FrontPage 制作个人主页的基本流程.

becka
Download Presentation

用 FrontPage 制作个人主页

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. 用FrontPage制作个人主页

  2. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 创建和编辑网站 • 使用向导创建各种站点

  3. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站

  4. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 创建表格 • 插入一个规则的表格 • 自绘表格 • 把文本转换成表格、把表格转换成文本 • 在表格中插入表格 • 在表格中选择和移动插入点 • 移动、复制、删除单元格中的内容 • 编辑表格 • 增加行或列 • 拆分和合并单元 • 改变单元格和表格的尺寸 • 单元格的属性 • 背景图像、颜色 • 表格的属性 • 背景图像、颜色、边框 • 给表格加上标题 • “表格”→“插入”→“标题”

  5. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 框架的作用 • 创建框架网页 • 使用菜单“文件” →“新建” →“网页” →“框架网页” • 在每个框架中指定一个初始网页或新建网页 • 在框架页中设置超级链接:注意每个窗格都有一个名字,要保证目标框架的正确 • 保存框架网页 • 常常需要一次保存多个相关的网页文件 • 注意查看框架页的HTML文件

  6. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 普通网页的设计步骤 1)新建网页,选择不同版式的网页或用表格规划网页 2)引入相关网页元素 3)修饰主题、网页属性、段落等,保存页面

  7. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 文字/图片/项目列表

  8. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 悬停按钮 横幅广告 • 字幕 搜索表单 • 计数器 视频剪辑 • 时间日期 建立目录 • 插入注释 • 包含其它网页 • 配置变量 • 定时显示图像 • 定时包含网页 • 插入HTML命令

  9. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 什么是超级链接 • 怎样建立超级链接 • 超级链接的目标: • 从WWW上查找一个网页作为目标 • 指定一个e-mail地址作为目标 • 从本地磁盘中指定一个网页作为目标 (相对路径) • 书签(同一文件或不同文件) • 实际上任何一个文件都可以作为超级链接的目标。文件的类型不同,浏览点击时打开的方式不同。有些由浏览器直接打开,有些由机器上的其他程序打开,有些则直接下载保存到磁盘。

  10. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 用图像作为超级链接 • 映像地图(Image Map)(热点,热区) • 改变超级链接的外观 • “网页属性”→背景 • 怎样编辑超级链接的属性 • 右键,“超级链接属性”→目标框架

  11. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 设置网页的常规属性 • “文件→属性”或右键快捷菜单“网页属性” • 设置网页的背景属性 • 设置网页的页边距 • 选择和应用主题 • 去掉或改变网页所应用的主题

  12. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 表单的特点 • 创建表单 • 意见反馈表模板 • 用户注册表单模板 • 表单向导 • 表单处理 • 隐藏表单域 • 指定表单处理程序 • 自定义表单处理程序 • 自定义默认的表单处理程序 • 自定义ISAPI、NSAPI、CGI或ASP程序 • 确认表单和确认表单域

  13. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 表单域的种类 • 单行文本输入框 • 滚动文本框 • 复选框 • 单选按钮 • 下拉菜单 • 按钮 • 用图像作为按钮 • 使表单域的标签具有可击性

  14. 用FrontPage制作个人主页的基本流程 • 新建个人网站 • 设计主页功能模块 • 表格或框架规划主页 • 设计普通网页 • 添加网页元素 • 插入活动元素 • 设计超链接 • 美化页面 • 运用表单 • 管理网站 • 发布网站 • 在网站中导入文件 • 删除和关闭网站 • 对网站进行设置 • 【参数】选项卡 • 【常规】选项卡 • 【高级】选项卡 • 【语言】选项卡 • 【导航】选项卡

  15. 用FrontPage制作个人主页的一些技巧 • Java是一种高级语言,主要用于网络应用的开发。它由Sun公司开发。 • 两种应用方式: • Java应用程序:是独立的程序,直接在操作系统下运行 • Java Applet:不能独立运行,必须嵌入到HTML文件中,并由浏览器来打开运行。Java Applet在设置网页的动态效果,交互式应用以及动态数据显示等方面有“特色”。 • 如何加入Java Applet? • 经过编译后的applet的扩展名为class,最简单的方式: • <applet code=“HelloWorld.class” width=200,height=50> • </applet> • 也可从FrontPage中“插入”→“高级” →“Java小程序”

  16. 用FrontPage制作个人主页的一些技巧 DHTML • Dynamic HTML 动态HTML • 它并不是一个新的标记语言。DHTML的三个组成元素是:浏览器的各项对象、Script语言和各项HTML标记。 • 含义:将浏览器及在浏览器上显示的网页对象化,利用Script语言来处理各项对象的动作与数据,并做出反应,达到互动的效果。

  17. 用FrontPage制作个人主页的一些技巧 ASP • 在服务器端执行的程序:CGI程序(Common Gateway Interface) • 缺点:通用性差,限制较多,有关数据库操作不方便 • ASP(Active Server Pages),也是在服务器端执行。 • 使用它可以创建和运行动态、交互的 Web 服务器应用程序。使用 ASP 可以组合 HTML 页、脚本命令和 ActiveX 组件以创建交互的 Web 页和基于 Web 的功能强大的应用程序。ASP 应用程序很容易开发和修改。 • 浏览器从 Web 服务器上请求 .asp 文件时,ASP 脚本开始运行。然后 Web 服务器调用 ASP,ASP 全面读取请求的文件,执行所有脚本命令,并将 Web 页传送给浏览器。 • ASP主要是基于Windows NT + IIS

  18. 用FrontPage制作个人主页的一些技巧 • 如何实现主页定时跳转? • 在<head>区加入: • <meta http-equiv="refresh" content="3;url=http://www.fosu.edu.cn"> • 3是时间单位是秒,http://是你想跳转到的url地址。 • 如何将我的个人网页在各大搜索引擎登记? • 各大网站上有指南! • 关于图片的处理 • 图片大小的改变、格式改变、特殊效果设置等,都要通过图象处理软件进行。最常用的有:Windows“附件”中的“画图”程序;Microsoft的“照片编辑器”,Adobe PhotoShop等

  19. 加入Flash • 如何加入下载的Flash? (扩展名swf) • 以下是将一个Shockwave Flash电影嵌入到网页中所需要的最起码的编码: • <OBJECT WIDTH=”200" HEIGHT=”60"> • <PARAM NAME="MOVIE" VALUE="tutorial.swf"> • <EMBED SRC="tutorial.swf" WIDTH=”200" HEIGHT=”60"> • </EMBED> • </OBJECT> • 这其中的swf的height和width都可以按照你自己的要求做出改动  

  20. 超级链接的颜色 • 做网页时如何去掉超级链接下面的下画线? • 用css进行设置,放置在<head>区 • <style type="text/css"> • <!-- • a:link { color: #3333FF; text-decoration: none} • a:visited { color: #3333FF; text-decoration: none} • a:active { color: #3333FF; text-decoration: none} • a:hover { color: #FF3333; text-decoration: underline} • --> • </style>

  21. 确定设置文字大小 • 如何才能让网页上的文字不随浏览器的字体大小而改变? • 在css里设定font-size,不过是要以pt、px等为单位。 • 在<style>中定义 • p {font-size:16px} 作用于所有<p> </p>之间的内容 • .fixed16 {font-size:16pt} 作用于 <span> ,<div>包围的文字,如:I am a <span class=“fixed16”>student</span>,则文字“student”的大小一直都是16pt。 • 也可单独定义一段文字的大小: • <P style=“font-size:16px”>Hello,World!</P>,仅作用于该段。

  22. 背景色和背景图片 • 怎样对一段文字或一段中的部分文字设置背景颜色和背景图片? • 一段文字: • <P style=“background-color:blue”> Hello,World! </P> • <P style=“background-image:url(bak3.gif)”> Hello,World! </P> • 部分文字:用<span style=“background-color:silver”> Hello </span> World ,则仅仅Hello有背景色 • 可以先在<style>中定义: • .blue {background-color:blue} • .bkimg {background:url(bak3.gif)} • 然后<span class=“blue”>Kiss me goodbye</span>I will try not to cry.

  23. 自动弹出新窗口 • 怎样实现一进入页面就会有欢迎的页面出现,退出又有再见的画面? • 用到了JavaScript,在<body>中加入:<body onload=alert(“Welcome”) onunload=alert(“Goob Bye”)> • 比较复杂的情形:可以自己控制窗口的大小、形状 • 下面的JavaScript函数newWin 中的参数newpage为要弹出的窗口中显示的网页文件名,也可直接给一个URL。 • 这个函数要放在<head>区

  24. 自动弹出新窗口 • <script language="JavaScript"> • <!-- • function newWin(newpage) • { msgwindow=window.open • (newpage,"Hello","menubar=0,toolbar=0,scrollbars=1,resizeable=1, status=0,height=300,width=400") • msgwindow.focus() } • status=“欢迎访问我的小窝" • --> • </script> • 然后再在<body>中加:<body onload=newWin(“ad.htm”) onunload=window.open(“http://www.fosu.edu.cn”)> • status给出的是状态行的信息

  25. 部分文字的动态效果 • 对部分文字实现动态效果 • FrontPage中的设置是对一段文字产生作用 • 用CSS:如Try it! Here<span onmouseover=“this.style.fontSize=‘40’; this.style.color=‘red’”onmouseout=“this.style.fontSize=‘’; this.style.color=‘’>变大变色</span> • 注意用英文状态的单、双引号,fontSize的S要大写 • 同样可以改变backgroundColor,backgroundImage等

More Related