导图社区 数据库与网页程序设计
- 201
- 7
- 3
- 举报
数据库与网页程序设计
这是一篇关于数据库与网页程序设计的思维导图，主要内容有第一章网页环境设计基础、第二章数据库逻辑设计及数据库系统结构、第三章MySQL数据库管理与维护等。
编辑于2022-08-29 15:20:01 吉林- 程序设计
- 相似推荐
- 大纲
数据库与网页程序设计
第一章网页环境设计基础
1.1网络应用程序概述
写在前面的话
应用程序是指为某些特定任务开发的计算机软件,由用户界面和运行在数据上的任务逻辑两部分组成
运行一个网络应用程序,通常需要数据库支持和多台可联网计算机一般将存储数据的计算机称为数据库服务器(简称服务器)或数据层
将网络中可以访问服务器的其他计算机称为客户端或表示层
1.1.1网络应用程序的结构
表示层:最接近用户 与用户直接交互,输入输出数据的界面窗口
业务逻辑层:也称领域层功能层处理层 是网络应用程序的核心
数据访问层:直接访问数据文件 为业务逻辑层提供数据服务
1.1.2网络应用程序的的模式
网络应用程序提供了单机应用不能实现的远程服务 保证了数据的安全性一致性实时性
C/S模式(客户端/服务器client/server)
双层结构 分为客户端和服务器
每个客户端都需要安装独立的应用程序(表示层&业务逻辑层)(胖客户端)
服务器端通常只提供后台数据管理和并发控制
适合单机或局域网环境
适合的开发语言:VB VisualC++ PowerBuider NET框架
减少应用程序的层次 较容易实现 各类业务处理分散到客户端 减轻服务器负担
B/S模式(浏览器/服务器browser/Server)
业务逻辑层移植到服务器端 客户端保留表示层的功能(瘦客户端)
网络浏览器是运行在客户端的轻量级应用程序
适合各种网络环境
网络中传输的是业务逻辑层处理过的数据
适合的开发语言:PHP(Hypertext Preprocessor) JSP(Java Server Pages) ASP(Active Server Pages)
解决应用程序维护和数据流量等问题
1.1.3网页,网站和网络应用程序
静态网页
使用标准HTML(Hyper Text Markup Language超文本标记语言)
扩展名为HTM或HTML
通过HTML标签描述页面元素位置和特征,通过浏览器将各个元素解析成网页要想改变内容只能在服务器端修改
网页内容对所有用户相同 仅作信息发布和媒体内容展示 动效都是预设
动态网页
随时间环境客户自动变化的网页
在静态网页基础上添加可在服务器端直接运行的脚本程序
网站
网站通过链接将主页与网站其他网页组织到一起
是网络应用程序架构在B/S模式下的典型应用
需要提供访问域名存放空间和服务程序
域名 一串用圆点分隔的名字组成
域名系统(DNS)
是一个主机信息数据库系统
采用客户端/服务器工作模式
基本任务:将域名翻译为IP地址格式(域名解析)
域名格式:节点名 三级域名 二级域名 顶级域名
顶级域名:
递归解析算法
树形结构
空间 网站服务器端的一块磁盘空间
服务器程序 解析并辅助动态网页运行的软件
网页服务器程序
数据库管理系统
1.2互联网+概述
1.2.1什么是互联网+
以互联网平台为基础,充分发挥互联网在生产要素中和产品销售中的优化和集成应用将互联网创新成果深度融入经济社会各领域中,提升实体经济的创新力和生产力,形成更广泛的以互联网为基础设施和实施工具的一种经济发展新形态
不是简单相加,而是利用信息通信技术和互联网平台使两者深度融合
特点(5)跨界融合 创新驱动 重塑结构 尊重人性 开放生态
1.2.2互联网+的应用
工业 商贸 金融 教育 民生
1.3网站的工作原理
访问网站实际上就是网页服务器与客户端浏览器交互的过程(通过超文本传输协议(Hypertext Transfer Protocol,HTTP))
浏览器发送HTTP请求 通过HTTP协议的统一资源定位器(Uniform Resources Locator,URL也称资源名)与网页服务器通信
网页服务器监听主机通信端口接入的网络请求 解析资源名 定位并返回 404表示资源不存在 503表示服务器过载无法访问
在浏览器中按F12打开开发者选项爬取数据
1.4网站建设的相关软件和技术
1.4.1网站的常用软件
网页服务器软件
Apache:使用率第一 所有系统运行 可作为代理服务器使用
Nginx:提供网页服务器和电子邮件服务 开放源代码
Microsoft IIS:专用于Windows 属于其内部组件
数据库管理系统(DBMS)
Oracle:比较流行 功能强大
DB2:跨平台工作 可伸缩性好
SQL Server:主要是Windows
适用于大型应用系统
Access:只能运行于Windows
MySQL:体积小 速度快 成本低
适用于中小型
1.4.2网页应用程序分类
标记性语言
HTML
CSS:公认的网络页面排版样式标准 帮助HTML实现样式和内容的分离
客户端程序
JavaScript编程简单 功能强大 支持跨平台 所有浏览器的支持 已经成为脚本标准
VBScript
可以手工编写代码 也可以借助Dreamweaver(DW)和FrontPage等可视化网页设计工具
服务器端程序(常见的服务器端程序)
ASP:动态网页技术标准,支持VBScript和JavaScript脚本 通常只与IIS一起使用 性能良好 跨平台能力不足
JSP:基于Java的脚本语言 支持Apache 可跨平台
PHP:一种跨平台的服务器端脚本语言设计 开放源代码 中小型
1.5Apache服务器的安装与测试
1.6MySQL数据库管理系统的安装与测试
1.7常见MySQL可视化管理工具
1.8XAMOO软件包的安装与测试
1.9网站建设的流程
规划网站:市场调查 评估自身条件 策划具体阶段
确定网站结构:主目录 博客目录 样式文件目录 图片文件目录
购买网站空间:购置服务器(大型企业) 主机托管 租用虚拟主机(中小型网站首选)
申请域名
发布网站－数据库设计
第二章数据库逻辑设计及数据库系统结构
数据库是有组织,结构化的相关联数据的集合,是存储事物特征最有效的一种软件工具,主要内容数据表,主键和表之间的关联等信息.数据库设计主要包括需求分析 概念设计 逻辑设计和物理设计4个环节.
2.1数据库逻辑设计的前期准备工作
2.1.1需求分析
分析业务流程(总体 细节 法律法规)
搜集和整理相关业务资料
2.1.2概念设计
概念模型:描述现实世界的事物及其关联的数据模型,与具体的数据库管理系统(DBMS)无关 最典型的就是实体关系模型Entity-Relationship 在其中 用矩形框注明文字表示实体 用椭圆框表示属性 连线表示隶属关系 菱形框表示实体之间的关联 框内文字注明关联方式
分析数据语意
2.2数据表及其常见术语
实体:客观事物的真实反映,可以是实际对象,或某种抽象概念或事件
实体型:实体类型的简称,表示一类实体,可以区分不同类型的事物
关系:无重复数据行的二维表,也称数据表或简称表
属性:表中的每一列都是属性,也称为列、字段、数据项 表中至少1个属性,不能重名;每个属性对应1个数据语义(原子性)
记录:表中一行,也称元组、数据记录 一个表中不能重复存储记录即任何两个记录中至少有一个属性的值不同 通常将只有表结构而没有存储记录的表称为空表
关键字:表中能唯一标识记录的最少的属性集合 通常也称为“键”“候选键”或“候选码” 主要用于检查和控制表中记录的唯一性
主属性((可以是多个):包含在关键字中的属性(并不是一一对应)主属性值不能为空 空白值即不确定值 0为确定值而非空白值
主关键字:某一阶段(控制主属性非空)只用一个关键字控制表中数据记录的顺序 除控制记录唯一性外 还用于控制表中数据记录的顺序(按主关键字的值升序或降序排列)以及与其他表建立关联
外键:(外码)表R的一种属性F,非R关键字,对应另一表S主键(语义相同)用表间建关联
关系模式:是关系名(表名)及其所有属性的集合 格式为:关系名(全部属性名表)
关系子模式:描述所操作的数据结构,与应用有关,属性可以来自多个表
数据操作异常
更新异常:修改某个实体数据时,可能同时修改多个记录的数据
插入异常:缺少主属性的值,新纪录无法添加到表中
删除异常:删除某些记录时,可能导致有保留价值的数据丢失
2.3属性的函数依赖关系
函数依赖:X和Y是R中的两组属性,对R中任意两个元组,若X的投影值相等,则Y的投影值就相等 记作X－>Y 即属性X的值决定Y的值 Y函数依赖于X
完全函数依赖:接上文 X的真子集x不能决定Y 记作X →上F Y
部分函数依赖
传递函数依赖:X－>Y Y－>Z Y不完全依赖于X且Y不属于X则称Z传递函数依赖于X
函数依赖可能是部分或完全函数依赖
传递函数依赖可能是完全或部分函数依赖
2.4关系模式的规范化
2.4.1第一范式
2.4.2第二范式
2.4.3第三范式
2.5数据编码对关系模式的作用
2.5.1数据编码
2.5.2数据编码的作用
2.6人才招聘数据库的设计
2.7数据库系统结构
第三章MySQL数据库管理与维护
运行环境:命令窗口和PHPMyAdmin可视化窗口
3.1MySQL数据库的常用管理工具
3.1.1MySQL命令窗口
启动MySQL后单击Shell按钮进入MySQL命令窗口(初始提示符号为#)
登录数据库服务器
-u<用户名>[-h<数据库服务器IP地址>][-p[<密码>]] 其中uhp必须小写
-u<用户名>
系统对登录用户名中的英文字母(区分大小写)
-h<数据库服务器IP地址>
默认为127.0.0.1
-p[<密码>]
例题:以用户gly的身份 密码为gly985 登录到IP地址为202.198.122.1的数据库服务器
MySQL-ugly-h202.198.122.1-pgly985
输入和执行MySQL语句
提示符MySQL>下,回车换行,半角分号+回车执行语句,上下左右改光标位置或找回执行过的语句,再次修改后按回车重新执行
MySQL可以与记事本和PHPMyAdmin复制粘贴
MySQL到剪贴板:控制菜单-编辑-标记 选定内容 控制菜单-编辑-复制
剪贴板到MySQL:控制菜单-编辑-粘贴(汉字适合在记事本或PHPMyAdmin编辑)
关闭MySQL命令窗口
先在命令中执行Quit或Exit语句 再点叉
3.1.2PHPMyAdmin可视化窗口
PHPMyAdmin主页
输入和执行MySQL语句
3.2MySQL语句的语法规则
3.3用户管理
3.3.1添加用户
3.3.2修改用户信息
3.3.3删除用户
3.4用户权限管理
3.4.1用户授权的操作
3.4.2用户授权的语句
3.4.3检查权限
3.4.4撤销用户的权限
3.5数据库管理
3.5.1创建数据库
3.5.2选择当前数据库
3.5.3修改数据库
3.5.4删除数据库
3.6创建数据表
3.6.1创建数据表结构的操作
3.6.2字段的数据类型
3.6.3设置字段的附加属性
3.7维护数据表
3.7.1维护数据表结构及相关索引
在“结构”中对表结构和相关索引进行维护(必须有Select和Alter权限)
增加新字段:输入个数选择位置单击执行
修改字段信息:点击修改后在数据表结构窗口中修改
删除字段:至少保留一个
设置主键及相关索引:单击“主键”创建主键索引 键名为Primary 单击“唯一”按钮用选中字段创建关键字索引 键名为选中的第一个字段名 单击“索引”按钮用选中的字段创建普通索引(Index) 键名为选中的第一个字段名
管理索引:“结构”选项卡中 单击索引前“+”按钮展开索引及操作框 也可以单击索引行“编辑”钮修改键名(索引名称)和索引类型 单击“删除按钮” 将删除对应的索引
3.7.2数据表操作
3.7.3数据表间关联及参照完整性
关联:大多数数据表之间直接或间接的关系 关联数据表没有约束条件的称为内关联 有约束条件的称为外键约束关联
创建数据表间关联及参照完整性的操作
数据表的外键主要用于与父表建立关联 因此创建数据表间关联前父表应该已经存在并创建了相关索引(主索引 唯一索引 普通索引) 通常以具有外键的数据表(子表)为当前数据表 单击其“结构”选项卡中的“关系查看”按钮 可以创建表间内键和外键约束关联
创建内联:从子表外键行“内连”下拉列表框中选择父表中的关键字 但不能用普通索引字段
3.8维护数据表中的数据
3.9复制及导入导出数据库
第四章数据库访问及结构化查询语言
4.1SQL语句的编辑及运行环境
4.2创建表
4.2.1创建表的语句格式
4.2.2创建表的关键字及索引
4.2.3表的外键 关联及参照完整性
4.3表及其维护结构
4.4MySQL的表达式
4.4.1算术运算符及常用的数学函数
4.4.2常用日期时间函数
4.4.3常用字符串函数
4.4.4混合数据类型的转换
4.5增加数据记录
4.5.1增加多个记录
4.5.2增加一个记录
4.5.3替换数据记录
4.6数据维护
4.6.1逻辑值表达式
4.6.2修改数据记录
4.6.3删除数据记录
4.6.4参照完整性对数据维护的影响
4.7数据查询及统计分析
4.7.1数据基本查询
4.7.2数据排序分析
4.7.3数据分组统计分析
4.7.4多个数据源连接
4.8SQL语句的嵌套
4.8.1主SQL语句与子查询
子查询语句的嵌套格式
子查询语句的嵌套位置
4.8.2嵌套语句的执行过程
4.8.3子查询的运算规则
ALL运算符
Any|Some运算
Exists运算
4.9SQL语句合并
4.9.1创建表与查询语句合并
4.9.2增加记录与查询语句合并
4.9.3查询语句的合并
4.10视图及其应用
4.10.1创建视图
4.10.2应用视图
4.10.3维护视图
4.11表中数据的导出与导入
第六章Dreamweaver及静态网页设计基础
HTML(超文本标记语言)是一种网页设计描述性的标记语言 用于描述网页内容的显示方式和结构 Dreamweaver是一款集网页设计和网站管理与一身的所见即所得的网页设计软件 通过可视化操作可以设计网页 由系统生成HTML和PHP程序代码
6.1Dreamweaver软件的安装与配置
6.1.1Dw系统的安装和启动
6.1.2Dw系统环境的配置
在“编辑”中设置首选项
6.2站点及其设计与管理
6.2.1 站点的基础知识
站点的概念:用于存储网站开发阶段的文件夹(目录)及其相关资源文件 文件夹由主目录和若干个子目录构成 每个目录用于储存网页(HTML)程序脚本(PHP)图像和样式(CSS)等网站的资源文件
文件夹类型
本地文件夹:网页设计者计算机上的任何位置的文件夹 存储分类文件夹 网页 程序脚本及其相关的资源文件 仅设计静态网页 只需本地文件夹
远程文件夹:位于Web服务器上 若设计动态网页 发布前需设置服务器文件夹 远程文件夹通常与本地文件夹同名 且具有相同的目录结构 便于文件上传
6.2.2建立本地站点
创建站点→设置对应的服务器及其文件夹
在本地磁盘上创建文件夹作为站点文件夹(主目录) 并在该文件夹中创建相关的资源文件夹 用英文或拼音命名
在Web服务器计算机上创建服务器文件夹
单击“站点”菜单→“新建站点” 弹出“站点设置对象”对话框
输入站点名称(将显示在“文件”面板和“管理站点”对话框) 输入站点文件夹名称
同一选项卡中“服务器”栏“+” 填写信息
“服务器”-“高级”选择服务器模型(PHP MySQL)等信息后保存
返回“站点设置对象” 添加一个服务器 勾选“远程”“测试”复选框
选中服务器行后 单击编辑可以修改或删除服务器信息
展开“站点设置对象”中“高级设置”在“本地信息”中设置默认图像文件夹
再次保存 完成第一个站点的设置 在“文件”面板中将展现站点文件 子文件夹及其相关文件
6.2.3管理站点
建立站点后 需要对各个站点进行管理 如打开 编辑 切换 删除和复制站点等
选择当前站点
保存网页文件时 系统默认当前站点的本地文件夹 可以从“文件”面板的下拉列表中选择站点名称切换当前站点
编辑站点
“站点”→“管理站点”→选择名称点击“编辑”/直接双击
“站点设置对象”的“站点”选项卡中可以修改站点信息 在“服务器”选项卡中双击服务器行或者单击“编辑现有服务器”按钮可以调整服务器的信息(含服务器的文件夹)
子主题
保存→返回“管理站点”→“完成”
复制站点
“管理站点”点选站点名→“复制”生成名称为“源站点名+复制”的新站点(与源站点具有相同的文件夹)
删除站点
只删除Dw与本地站点之间的关系 并不删除文件和文件夹 “管理站点”中选择要删的→“删除”
6.3Dreamweaver基本操作
Dw是设计网页的一种可视化向导 在向导的引导下 通过键盘或鼠标操作菜单 对话框或控制面板等可视化对象 可以生成HTML代码 协助用户设计网页
6.3.1工作界面
工作界面由工作模式下拉框 菜单栏 文档工具栏 文档窗口 状态栏 属性面板和浮动面板等部分组成
工作区布局选择
菜单栏:用于显示菜单项 主要包括文件 编辑 查看 插入 修改 格式 命令 站点 窗口和帮助菜单项
文档工具栏:包含编辑文档的常用操作按钮 如代码 拆分和设计等 使用这些按钮可以快速切换文档的视图模式 还可以预览/调试网页和设置网页标题等
文档窗口
用于显示当前文件内容 窗口顶部的选项卡显示所有打开的文件名 若修改文件内容尚未保存 则文件名后显示星号
3种视图方式
代码视图:用于编辑HTML JavaScript 程序脚本代码(如PHP)以及任何其他类型的代码 在代码视图中可以查看 修改和编写网页代码 在输入HTML代码的过程中 可以采用代码引导功能选择标签及其属性 按空格键后 从下拉列表框中选择属性名 再进一步输入或选择属性值
设计视图:用于可视化页面布局 直接输入网页中的内容 以可视化形式呈现 类似于浏览器的风格 所见即所得的方式显示和编辑网页的内容
拆分视图:将窗格分为左右两个部分 左窗格是代码视图 右窗格是设计视图 单击设计窗格中的内可以定位代码窗格中的代码 便于查阅和修改网页的代码
状态栏
显示当前文档的相关信息 如当前标签名称和信息缩放百分比等
属性面板
又称属性检查器 单击“窗口”→“属性”其内容与当前选中的元素有关
浮动面板组
工作界面有许多功能小窗口(面板) 所在位置不确定 通过鼠标可以拖动改变位置 系统默认显示插入CSS和文件面板等 单击“窗口”菜单可以打开其他面板
6.3.2设计网页的一般步骤
新建网页
“新建”→HTML
编辑和保存网页
单击编辑区输入网页内容
“文件”→“保存” “另存为”
预览网页
单击工具栏中“在浏览器中预览/调试” 选择“预览在IExplore” 也可以按F12或者单击“文件”菜单→“在浏览器中预览”→IExplore选项 预览网页
6.4HTML文档的设计基础
HTML文档(文件)是由标签(也称标记)符号定义的各元素组成的 即网页是由HTML标签进行描述的 网页与HTML文档是同一概念的两种不同表现形式 用HTML编写的代码文件成为HTML文档 而HTML文档通过浏览器展现出来的页面效果称为网页
6.4.1HTML基本术语
HTML文档由诸多元素组成 每个元素由标签或标签及其属性构成 各种标签有各自的属性和作用
标签
标签是HTML中一些有特定意义的符号 它决定着网页的效果和布局 标签都括在一对尖括号中
对标签由起始和结束标签组成 起始标签一般用“<标签名称>”表示 结束标签一般用“</标签名称>”表示 中间是受标签控制或修饰的内容 如“<B>网页程序设计</B>” 中间“网页程序设计”功能以粗体显示
对标签:加粗标签b strong & 倾斜标签i em & 下划线标签u & 字体标签font & 下角标标签sub & 上角标标签sup & 删除线s del & 段落标签p & div标签:盒子元素、块级元素和容器,用于区块的划分 & span标签 & 列表标签ol li ul & 文本标题标签h1-h6 & 超链接标签a & 表格标签和表单标签 & 表单标签
单标签只有起始标签 不包含任何内容 往往只完成一个功能或操作 一般在首部或尾部加斜杠如“<Br/>”和“</Br>”均表示换行符
单标签:换行标签br&水平线标签hr&图片标签img&页面元信息标签<meta>
对标签 由起始和结束标签组成
起始标签一般用“<标签名称>”表示
而结束标签用“</标签名称>”表示
中间是受标签控制或修饰的内容
标签基本格式：<标签名称 属性名1="值1" 属性名2="值2" ......”>
元素
一般由对标签、属性以及标签之间的内容构成 浏览器根据标签的作用解析各个元素 如“<Title>我的第一个网页</Title>”用于描述网页标题 中间的汉字“第一个网页”叫做元素内容
有些元素只有起始标签及其属性 如“<IMG SRC="LOGO.JPG"Width="50" Height="50"/>”
HTML元素的完整结构如图所示
标签属性
多数标签具有属性 每种标签的多个属性之间没有前后顺序关系 用空格隔开即可
属性包括名和值 属性值必须在元素的起始标签中自定义 通常包含在半角双引号中
如果属性代码中出现引号嵌套 外层用' 内层用"
6.4.2HTML文档的设计工具及规则
一个网页对应一个HTML文档 文档的扩展名为HTM或HTML 内容是纯文本 因此可以使用任何能编辑纯文本的软件编写HTML文档
用记事本编写HTML文档
在设计HTML文档的过程中 首先要用编辑器新建HTML文件 编写HTML代码 保存文件后才能浏览网页效果
例：新建网页Onepage HTML浏览效果如图 在记事本输入代码后点击“文件”-“保存”-类型-所有文件-更改文件名为“Openpage.HTML” 再保存
设计HTML文档
在Dw中创建空白文件后切换到“代码”视图 在标签之间输入内容后保存 按F12浏览
在新建的HTML文档中 系统自动生成的若干代码
<! DOCTYPE html …>用于声明文档类型而非标签且不许在首行 如果文档里缺失浏览器会按默认文档类型打开网页 效果可能不同
< Html xmlns =＂http://www.w3. org /1999/xhtml＂> 说明整个网页标签应该符合 XHTML 的规范。
< meta http - equiv =" Content - Type ＂ content =＂ text / html " ; "charset = utf -8"/>
＜ meta ＞标签可提供有关页面的元信息（ meta - information )，如搜索引擎的关键字。< meta ＞标签位于＜ head >…</head>内 没有结束标签
http - equiv =" Content - Type ＂用于描述文档类型
content =＂ text / html "表示浏览器要解析HTML文档
"charset = utf -8"表示文档内容采用utf-8支付编码 中文网页通常采用GB2312或utf-8编码
互联网搜索引擎将查找＜ meta ＞元素中定义的关键字。例如，在设计网页时，编写< meta name =＂ keywords ＂ content =＂人才招聘，用人岗位， MySQL "＞代码，在互联网搜索引擎界面中输人“人才招聘”“用人岗位”或“ MySQL ”关键字，都能搜索到该网页。
HTML的书写规范
文件列宽不受限制 多个标签可写成一行
标签中某些项不能从中间断开分行写
尖括号 标签和属性名等必须使用半角字符
6.4.3HTML文档基本结构
至少包括四对标签 各对标签及顺序如图所示
(1)< Html ＞结构标签 通常处于文档的最前面，表示文档开始，即浏览器从＜ Html ＞开始解析网页，直至遇到＜/ Html ＞为止，因此，< Html >…</ Html ＞标识了HTML 文件的开始和结束，所有其他标签都包含在<Html ＞和＜/ Html ＞之间
(2)< Head ＞头部标签 内容被称为文件头，包含关于网页文档的信息，例如网页的标题、脚本、样式（ CSS ）定义及文档的元信息等，这些信息大部分不在浏览器窗口中显示。元信息是指网页的设计日期、作者、版权及关键字等，以便用户了解网页的基本情况，同时供搜索引擎进行分类搜索
(3)< Title ＞标题标签 用于设定 HTML 文档标题内容，应用于＜ Head ＞和</ Head ＞标签之间，是网页头部不可或缺的一部分。每一个 HTML 文档都必须有且只有一个＜ Title ＞标签，浏览网页时，在浏览器窗口的标题栏中显示文档标题内容
(4)< Body ＞主体标签 用于指明 HTML 文档的主体区，是网页的可见部分，可以包含文本、图像、链接、音频、视频、表格和表单等各种内容
6.4.4<Body>页面主体标签
< Body >…</ Body ＞标志着一个网页文档的主体区包含浏览器中显示的信息 < Body ＞标签的属性用于设置整个页面，例如网页的背景颜色、背景图案、文字颜色及链接等。
标签格式：< Body Bgcolor ＝背景颜色值 Background ﹣背景图文件名 Text ＝文字颜色值＞主体区各种元素く/ Body >
< Body ＞标签的常用属性如表6-1所示。
【例6.2】设置网页的背景为灰色，文字颜色为红色。 <Html>く Head >< Meta CharSet =" uft -8"/>< Title ＞网页颜色＜/ Title ></ Head > < Boy Bgcolor =＂# cccccc " Text =" Red "> 欢迎访问人才招聘网！ </ Body >く/ Html >
6.5文本与图像设计
文本格式的设定可以直接从HTML入手 也可以通过Dw工具来实现
6.5.1标题级别
Hn标签
标签格式<Hn Align=对齐方式……>标题内容</Hn>
网页的主体区中可以设计<H1><H2>……<H6>共6级标题 标题标签标识的文字独占一行显示 标题级别决定了字号大小和粗细程度 系统默认数字越小级别越高 因此一级标题<H1>字号最大 六级反之 通过标题的属性可以重新设置标题的样式
选择标题的操作:通过属性面板可以选择对应的标题级别 选中文档文字 在属性面板中HTML选项 在格式列表中选择
6.5.2段落与换行
浏览纯正文内容时 只有当信息超过浏览器宽度时才自动换行 要使信息自成段落或另起一行输出 除加标题标签外 还可以用换行和段落等标签
换行标签<Br></Br><Br/>是单标签 从该标签位置开始另起一行输出信息
段落标签
标签格式<PAlign=对齐方式……>段落内容</P>段落标签用于划分一个段落 段落的内容可以是文本及图像等其他类型的对象 浏览器在处理<P>标签时 将另起一行及一个空白行 即各段落之间空一行
设置换行和段落的操作
在文档窗口的设计视图中输入一段文字后按Enter键 就形成一个段落 内容包含在<P>...</P>标签中 按Shift&Enter键 即换行 生成<Br/>标签
通过“属性”面板设置段落的方法 选中一段文字 单击“属性”面板上的HTML选项 在“格式”列表中选择“段落”
6.5.3文本基本属性
文本是网页信息的主要载体 文本的基本属性有字体 字号和字的颜色等
Font标签
标签格式
常用属性
设置文本属性的操作
选择CSS选项 选中一段文字 单击“属性”面板的CSS选项 如图
编辑字体列表
新建CSS规则-“选择器类型”-“类”-“选择器名称”中输入样式名称
在“属性”中设置文本的大小与文本颜色
6.5.4文本格式标签
文本格式标签
用文本格式标签修饰网页中的文字格式 如文字加粗<Strong> 倾斜<Em>加下画线<U>加删除线<S>上标<Sup>下标<Sub>大字体<Big>小字体<Small>
子主题
设置文本格式属性的操作
从选中文本的右击菜单中选择“样式”下的相关选项可设置文本格式 有些标签需要在“插入”-“标签”-“标签选择器”中添加 如<Sub><Sup><Small><Big>
6.5.5图像的添加与设置
图像是网页中的重要元素 不仅具有烘托网页主题的作用 也能加深用户对网站的印象
IMG标签
图像的标签是<IMG>是一个单标签 用/闭合
设置图像属性的操作
光标定位于要插入图像的位置 “插入”-“图像”-“选择图像源文件”-选择图像文件后点确定
“属性”面板中设置图像的相关属性
宽&高:以像素为单位设定图像的宽度和高度
源文件:制定图像的具体路径及文件名
替换:当浏览器无法显示图像时 在图像位置显示该文字信息
边框:以像素为单位设定图像边框的宽度
6.6连接与锚记设计
网页中通常用链接(也称超链接)关联其他网页或网站 主要依据文字或图像(也称链接对象)创建链接 通过引用对象关联其他文件名、网站域名(IP地址)及E-mail地址等 在网页中通常用链接实现网页导航 在浏览器中 链接文字对象通常带有下画线和特殊颜色 鼠标指针移动到链接对象时 指针变成手形 单击链接对象后 将跳转到链接对象引用的对象网页
6.6.1链接设计
标签格式:<A Href="引用对象名"Target="浏览引用对象的窗口名">链接对象内容</A>
引用对象名
应用对象名是链接要跳转的目标资源名 可以是文件名、网站域名(IP地址)及E-mail地址 常用引用对象的含义如下
浏览引用对象的目标窗口名
浏览引用对象的目标窗口用于说明打开引用对象的位置 该窗口名可以是网页中定义的框架名 例如<a href="bbsrght. html" target="fr2">讨论区首页</a>其中fr2为框架名 此外还可以是如表6-5所示的系统值
链接对象内容
用户通过浏览器由一个网页跳转到另一个网页的操作对象 通常是浏览器中可见的内容 如文字和图像等
例:<A Href="Index.html"><IMG Src="../Image/Logo.gif"Width=135 Hight=100></A>
链接设计向导
选中链接对象内容 在属性面板中链接框中输入引用对象名或单击“浏览文件”按钮选择引用对象 在目标下拉列表中选择浏览引用对象的目标窗口名
插入-常用-超级链接 在对话框中也可以设置链接的相关参数
6.6.2引用对象的文件路径
当链接的引用对象是文件名时 文件名前要加路径
绝对路径
完整的URL地址 如http://www.jlu.edu.cn.Index.html和E:\RCZP\ Image\BJ.gif
由“/”开始的路径表示从站点主目录开始 如/Index.html是站点主目录中的文件 Index.html /Image/bj.gif是站点主目录下子目录Image中的文件bj.gif
绝对路径的优点是可以精确地定位文件 缺点是不利于测试和站点移植 当应用当前站点以外的文件时通常使用绝对路径
相对路径
是指以当前网页文件所在的文件夹(简称当前目录)为起点的路径 说明当前网页文件与应用文件之间的相对位置关系 因此在创建设计链接前 应该保存当前网页文件 以便确定相对路径的起始位置 常见的相对路径有如下几种书写形式
当前目录:直接写文件名或文件名前加“./” 如Index. html 或 ./Index. html
当前目录下的子目录:直接写子目录名和“/”例如Image/bj.gif 表示引用当前目录下Image文件夹中的文件 bj.gif
前级目录:“../”表示前级目录 如..、RCZP.HTML表示当前目录中前级目录的RCZP.HTML ../Image/bj.gif 表示当前目录的同级目录Image中的bj.gif文件
6.6.3设计链接文字的颜色
6.6.4锚记链接
6.7水平线及媒体播放设计
6.8CSS设计
设计网页除需要HTML语言外 还需要CSS(Cascading Style Sheets层叠样式表 简称样式表) CSS主要用于描述XHTML文档的样式 使网页格式化 网站整体设计风格一致
6.8.1CSS基础
设计网页时 通常HTML标签定义网页的内容 用CSS设计修饰标签的格式 可以将CSS理解为一个预先定义的格式集合 与HTML文档配合使用 当浏览器读到样式表时 按照样式表对页面元素的字体样式 背景 表格 链接 排放方式 区域尺寸和边框等显示方式进行控制
一个CSS样式表可以同时作用于多个HTML文档 如果将整个网站所有网页的外观样式指向同一个CSS 可以使网站的整体设计风格统一 修改CSS中的某个样式 能使所有相关网页的样式随之变化
使用CSS能够简化网页代码 加快下载速度 减少重复设计 便于网站维护
CSS语法基础
层叠样式表包含一组样式规则 可以直接写在HTML文档中 也可以单独存储在扩展名为CSS的文件中 用下列格式描述每个样式 语法格式:选择器{属性1:值1;属性2:值2;……;属性N:值N}
选择器 包含类型说明和名称 类型说明是指选择器的类型 主要有标记选择器 类选择器和ID选择器 而名称可以是英文字母及其开头的数字或减号“-”的组合 一般根据功能或效果命名
声明:要用花括号括起来 每条声明由一个属性和值组成 属性和值用冒号分隔 声明之间用分号隔开
CSS样式
在CSS样式中经常需要设置字体 文本 背景等属性 其中字体背景用于设置文本的字体 大小和加粗等 文本属性用于设置文本的颜色和对其方式等 背景用于设置背景颜色和背景图片 产检属性见表
6.8.2CSS选择器
标记选择器
一般用于整体样式的控制 每一种HTML标签都可以作为相应的标记选择器名称 标记选择器名称决定了该标签采用的CSS样式 例如 P{ Color: #FF0000; Text-Align: Center}规定所有<P>标签都采用红色字 居中显示的统一样式风格
类选择器
类名称前加圆点 可用于HTML标签 可被引用多次
Id选择器
用于定义单一元素的样式 为标有特定Id的元素指定样式 定义Id选择器时 类名称前加井号
与类选择器相比 Id选择器有以下特点
一个Id选择器只能在一个HTML文档中使用一次 否则JavaScript等脚本语言调用时会发生意外错误
Id选择器不像类选择器一样能多个合并使用 一个元素只能引用一个Id名 如<P Id="First Next">是错误的
Id选择器主要用于网页中的特殊修饰 如标志、导航栏、主体和版权等内容 通常命名为#Logo #Nav #Content #Copyright等 避免与其他样式发生冲突
6.8.3创建CSS
根据样式表代码位置的不同 CSS分为内嵌样式表 内部样式表和外部样式表3类
内嵌样式表
也称内联样式表 即将样式代码通过Style属性直接嵌在标签内 仅对所在标签有效
例如<P Style="Color:Sienna;Font-Size:20px">岗位名称</P>内嵌样式表使用简单 直观 适用于仅应用一次的样式
内部样式表
是在HTML文档的<Head>标签内使用<Style>定义样式 在<BOdy>标签内引用 只对所在的网页文档内容有效
外部样式表
将CSS样式规则独立存储于扩展名为CSS的文件中 HTML文件通过链接方式引用它 实现网页HTML与CSS代码的完全分离 外部样式表对所有引用它的网页都有效适用于设计相同样式网页的网站 可以修改CSS文件改变整个网站风格 采用外部样式表可以减少重复代码 降低下载数据量 方便网页维护
外部样式表文件可以在任何文本编辑器(如记事本)中编辑 但不能包含任何HTML标签 每个网页中使用<Link>标签链接到样式表晚间 <Link>标签必须放到HTML文档的头部<Head></Head>标签内
语法格式 <Link Rel="Stylesheet" Type="Text/Css" Href="../Css/CSS文件名"/>
浏览器根据CSS文件修饰格式网页 其中rel="stylesheet"表示使用外部样式表type="text/css"表示文件类型是样式表文本 href="../css/CSS文件名"指出样式表文件所在位置 通常使用相对路径
第七章静态网页设计
设计网页时需要规划网页的布局内容和演示 再充分利用模板提高网页的设计效率
7.1网页布局设计
对页面中的文字 图片和多媒体对象和表格进行统一的样式和位置设计 在设计网页内容之前 根据网站的类型定位 明确标志 导航栏 菜单和正文的摆放位置
7.1.1常见网页版面布局类型
7.1.2使用Dw预设布局
文件-新建-新建文档-HTML
7.2Div元素及CSS布局
7.3框架集及框架设计
7.4表格设计
表格的基本作用是在网页中显示结构化数据 由于文本和图像插入页面后 会随浏览器尺寸变化而改变位置 将其放入表格内可保持其位置 所以表格也可以用于页面布局
7.4.1表格的基本结构
由一行或多行组成 每行又由一个或多个单元格组成列 行列及单元格有效地描述了二维信息的组织方式
为更好地实现布局效果 一个完整表格还包括标题 边框 填充和单元格边距等概念
标题(Caption):表格上方居中显示的文字内容 可以省略
列标题单元格(TH):表格中第1行 也称表格列标题 默认以粗体居中显示
表格边框(Border):整个表格的外部边框线或单元格的边框线
单元格填充(Cellpadding):在单元格内部 内容与边框之间的空区域
数据单元格(TD):装载数据 包括文字、图像和链接等内容 可以多行
单元格间距(Cellspacing):两个相邻单元格边框之间的空白区域
7.4.2设计表格
表格是较为复杂的结构 可以添加到页面任意位置 需要多个标签配合才能创建表格
设计表格结构
Table标签通过属性描述表格整体结构 常用属性如表7-6
<Caption>···</Caption>标签定义表格的标题 默认居中显示在表体上方
<Tr>···</Tr>标签用于定义表格的一行 <Tr>元素的个数与表行数一致 在元素内部通过<Th>或<Td>标签定义当前行包含的列单元格 有时为了简化代码 相邻的两个<Tr>开始标签中可以省略结束标签</Tr>
<Th>···</Th>标签用于定义表头单元格 单元格内容默认以粗体居中显示
<Td>···</Td>标签用于定义普通单元格 相邻的两个<Th>或<Td>开始标签中可以省略结束标签
7.4.3表格设计向导
7.4.4利用表格进行布局
7.5表单及其控件设计
7.5.1表单概述
7.5.2设计表单
7.5.3设计表单控件
7.6Spry构件设计
7.7模板设计与引用
第八章PHP程序设计基础
8.1PHP程序的编辑和运行
8.2PHP程序的语法
8.3PHP与HTML的区别及关联
8.4变量及表达式
8.4.1变量的定义及引用
8.4.2表达式及其输出
8.4.3输入变量的值
8.5字符串表达式
8.5.1字符串
8.5.2字符串的连接符
8.5.3字符串的常用函数
8.6数值型表达式
8.6.1常量
8.6.2数值运算符
8.6.3运算符的优先级与结合性
8.6.4常用数值函数
8.7日期和时间表达式
8.8逻辑值表达式
8.8.1逻辑运算符
8.8.2比较运算符
8.8.3条件运算符
8.8.4逻辑值函数
8.9正则表达式简介
第九章PHP程序设计
9.1数组
9.1.1数组分类
9.1.2创建数组
9.1.3输出数组
9.1.4多维数组
9.2分支程序设计
9.2.1If...ElseIf...Else...分支结构
9.2.2Switch Case分支结构
9.3循环结构程序设计
9.3.1While循环结构
9.3.2Do...While循环结构
9.3.3For循环结构
9.3.4循环嵌套
9.4数组的典型应用
9.4.1数组元素的排序
9.4.2数组元素的查找
9.4.3遍历数组
9.5获取表单控件数据的程序设计
9.5.1调用PHP程序的表单设计
9.5.2获取表单控件的数据
9.6自定义函数设计
9.6.1用户自定义函数的结构
9.6.2函数的调用
9.6.3函数的参数传递
9.6.4程序文件之间的数据传递
9.7变量作用域
9.8二维码程序设计
9.9PHP程序出错处理
9.9.1简单的错误处理
9.9.2用户自定义错误处理
第十章动态网页及程序设计
10.1网页与数据库服务器的连接
10.1.1连接数据库服务器
10.1.2连接数据库服务器的函数和语句
10.2发送SQL语句的向导
10.2.1发送简单Select语句的向导
10.2.2发送与设计Select语句的向导
10.3数据查询动态网页程序设计
10.3.1在DW中插入记录
10.3.2输出记录集中的数据
10.3.3与记录集相关的函数
10.4数据维护程序设计
10.4.1设计插入数据的网页程序
10.4.2设计删除和修改记录的程序
10.4.3删除和修改数据记录的程序设计向导
10.5用户注册网页程序设计
实验一
规划用户及其权限
设计人才招聘数据库及其表
设计人才招聘数据表间关联及其参照完整性
维护人才招聘数据库
实验二
MYSQL客户端的登录及其应用
设计表间关联及其参照完整性
设计图书数据库及其表
规划用户及其权限
输入售书数据库中的数据
修改售书数据库中的数据
实验三
SELECT语句的编辑和运行环境检测
查询语句的表达式设计
多个数据源的查询设计
数据统计分析设计
SQL语句的嵌套设计
视图的创建及应用
实验四
建立网上书店站点
网页模板设计和浏览
登录网页和密码修改网页
实验五
管理员和用户网页设计
显示数据网页设计
新增修改i和删除数据网页设计
表达式应用
数组定义
实验六
IF分支程序设计
多分支程序设计
循环程序设计
实验七
网页模板及数据库连接接口设计
用户登录/退出的网页设计
管理员数据维护程序设计
实验八
普通用户图书选购页面设计
普通用户订单管理页面设计
第五章MySQL程序设计
第十一章会话管理及应用
第十二章移动互联网网页及程序设计
第十三章BBS系统的程序设计
第十四章人才招聘网站综合设计
网站认证方法
数据库设计
第五章计算机网络技术