《网站创建与静态网页》由会员分享，可在线阅读，更多相关《网站创建与静态网页（81页珍藏版）》请在金锄头文库上搜索。
1、 西北农林科技大学 陈建平 2010虽有嘉肴，弗食不知其旨也； 虽有至道，弗学不知其善也。 是故学然后知不足，教然后知 困。知不足然后能自反也；知 困然后自强也。故曰:教学相 长也 礼记学记篇提纲： 一、Web 初步 1、什么是网站？如何创建一个网站 2、静态网页的制作（工具 Dreamweaer、记事本；DIV+CSS设计） 3、动态网页基础知识（原理；GET、POST） 4、Javascript 应用（jQuery应用）二、Flash 在网页当中的简单应用 1、Flash与Web页的相互链接（getURL应用） 2、Flash与后台通信的方法 3、Flash加载Web上的资源（文本、Fla
2、sh、图片、音频、视频）三、Flash Web高级应用 1、 URL字符串应用 2、 XML 知识及应用 3、 JSON 知识及应用什么是网站？2007年10月 全球网站 2.5亿个；网络已经成为人类社会的神经 系统，网站就像一个个神经元一样，遍布全球，成为人类知识 与信息传播、存储的主要基础设施网站的三个要素：1、网络地址 （域名、IP、端口）2、网站空间3、源文件什么是网站？自建网站的流程：1、取得服务器空间2、接入网络，取得网络地址（IP、域名）3、安装服务器版操作系统4、设置好网络服务软件（以Windows为例）Web 服务：IISFTP 服务：Serv-U、FileZilla Ser
3、ver流媒体视频点播：Media Server5、设计好网页文件，上传到空间如何创建一个网站？1、通过网络服务商购买虚拟主机服务（Vhost，VPS等） 2、由专门机构提供空间（比如学校的网络中心） 3、自建（自管、托管）创办网站：1、取得服务器空间IP地址：网络是由各种的网络设备（路由器、交换机、 服务器、计算机）组成的，每个设备都有独特的数字编 码，如同门牌号一样。如此，才能在复杂的网络世界中 相互找到。这个数字编号就是 IP 地址。例如： 210.27.94.9 创办网站：2、取得网络地址端口号：在同一个IP设备上，再进行地址划分。一般用于区分应用 程序。http:/:8080/inde
4、x.aspx (端口号8080） http:/ （默认，80） http:/:80/times.aspx（常用端口解释：80为WWW服务；21为FTP服务；3306为 MySQL数据库端口等等）试着在常见的网址域名后加上 :80 你发现了什么？ 有时上网不需要设置IP，说明计算机联网不需要IP地址吗 ？域名： 为了方便记忆，使用英文代替 IP 地址。例如： WWW.ChinaOntology.NET 可以从域名代理机构注册购买。服务商会提供域名操作面板，让你将域名与你的服务器IP绑 定，以后全球的访问者均可以通过域名找到你的服务器DNS 域名与IP地址相互翻译的服务过程如何知道一个域名的 IP
5、 是多少呢？Windows 运行 - cmd 进入 DOS 命令状态键入ping 命令看看动手实践创办网站：3、安装服务器系统IIS 里面的虚拟主机设置创办网站：4、安装设置服务器软件填写描述信息，仅供自己查看时方便； 建议写上域名填写域名、端口、IP地址；这三者的组 合不同，就代表不同的网站IP端口主机头（域名） 最终访问地址http:/http:/http:/:8080 210.27.94.980http:/210.27.94.9 210.27.94.98080http:/210.27.94.9:8080 127.0.0.180http:/127.0.0.1 127.0.0.18080h
6、ttp:/127.0.0.1:8080 127.0.0.180http:/localhost 127.0.0.18080http:/localhost:8080 设置网站对应的目录 （以后网页就保存于此）设置网站运行权限网站的启动、暂停新站测试！课后： 在Xp中创建网站在 WindowsXP 下，步骤如下：1）控制面板- 添加删除程序 - 添加删除Windows组件 - 选择 IIS 组件2）IP 地址： 127.0.0.1 “免费域名” localhost （不用填主机头）(见前面的主机地址格式表格)其余的设置与前面讲述的一致动手实践1、如果你能直接操作服务器，Copy 即可 2、远程更新内
7、容，一般使用 FTP 方式更新；（管理员安装 FTP 服务器软件；通过创建账户，为账户 指定目录及其读写权限，可为不同用户创建不同服务）创办网站：5、网站文件的制作与上传FTP服务安装 FileZilla服务器软件配置创建账户为账户指定口令为该账户指定一个目录FTP 客户端软件：1、下载 Client 版本，安装FTP 客户端软件：2、在站点管理器中添加FTP站点信息端口号默认为 21FTP 客户端软件：3、以后访问该 FTP 站点，就简单了 点击站点，即可连接到服务器通过在本地、Web目录之间拖动文件，即可上传下载几个FTP站点：地址： 匿名地址： 匿名佛法三藏：不用辛苦取西经了地址： 21
8、8.5.77.22:21用户名： fodian密码： china_fodian请同学下载安装FileZilla,连接以下站点，上传自己的网页：地址：210.27.94.9 用户名：student 口令：student方法： 1、在Web上创建自己的目录，以学号命名 2、在你的计算机上创建一个目录（最好也用学号），以此 为工作目录。设计一个Html网页，命名为default.htm 3、将网页及其附件上传到 FTP 空间中 4、打开以下网页，就可以看到成果了：http:/ 动手实践结果出来了！FTP 数据更新WWW 网页浏览小型网站的结构网络地址大型网站的逻辑结构静态网页的制作基本工具： Dre
9、amweaver 记事本主要了解： （1） Html 标签语法及其含义（2） CSS 样式表（3） Javascript 应用 无标题文档Dreamweaver 创建的默认网页推荐学习网站： http:/标签语法要点： 1） 网页由Html标签组成2) 标签像括号一样，有起点，有终点3） 标签有值、有属性4） 有些标签可以内嵌其他标签，形成层次结构Html 标签语法 Html 标签语法 SampleMy First HeadingMy first paragraph.1） 网页由Html标签组成HTML 标题 HTML headings are defined with the to tags
10、. Example This is a heading This is a heading This is a heading HTML 段落 HTML paragraphs are defined with the tag. Example This is a paragraph This is another paragraph HTML 超链接 HTML links are defined with the tag. Example This is a link 我的书籍HTML 图像 HTML images are defined with the tag. ExampleHTML 水
11、平线HTML 换行HTML 区域 Some Text HTML 表格姓名专业Bruce动漫游戏Html 标签语法 2）标签像括号一样，有起点，有终点HTML Elements An HTML element is everything from the start tag to the end tag: Start tag Element content End tagThis is a paragraph This is a linkAn HTML element starts with a start tag / opening tag An HTML element ends with
12、an end tag / closing tag The element content is everything between the start and the end tag Some HTML elements have empty content ; Empty elements are closed in the start tag Html 标签语法 3）标签有值，有属性Start tag Element content End tagThis is a paragraph This is a link属性值HTML 元素的核心属性id 是元素的唯一身份（编程时要用到） cl
13、ass 是元素的类别（主要用于设置共同的属性） style 是直接设置元素显示样式的属性 title 为元素提供一些信息；有些会形成鼠标文本提示Html 标签语法 4） 标签可以嵌套，形成层次结构SampleMy First HeadingMy first paragraph.- HTML 标签列表推荐学习网站： http:/CSS语法要点： 1） 由选择器、属性声明两部分组成2） 选择器的基本形式：类（.开头）、对象（#开头）、html元素CSS 样式控制 内联样式 style属性的应用这是一段实例；看看style属性应用的结果body background-color:#d0e4fe; h
14、1 color:orange; text-align:center; p font-family:“Times New Roman“; font-size:20px; head 内嵌定义样式三种形式的选择器： .开头的，如.myClass，应用于 class=“myClass“ 的元素#开头的，如#myBook，应用于 id=“myBook“ 的元素直接以元素名开始，应用于该元素body background-color:#d0e4fe; h1 color:orange; text-align:center; p font-family:“Times New Roman“; font-size:20px; 引用外部样式表无标题文档my.css推荐学习网站： http:/DIV + CSS 设计要点： 1） 网页由Html标准标签组成，以Div划分布局2) 使用 CSS 控制元素与布局的样式优点：主要是将 Html 内容与表现形式做了分离；便于美工与内容撰稿人、程序员等相互之间的合作。样式控制更加灵活。DIV + CSS 页面设计 推荐学习网站： http:/简称 JS它是目前 Web 设计当中必不可少的技术，主要用来控制网页内容（DOM文档对象模型），生成动态的效果，提高用户体验的满意度。Javascript 应用 alert(“Hello，World!
