黑马程序员技术交流社区
标题: 【黑马程序员杭州】PHP课程笔记day03-HTML网页框架及表单标签 [打印本页]
作者: 鱼丸儿 时间: 2017-10-29 21:41
标题: 【黑马程序员杭州】PHP课程笔记day03-HTML网页框架及表单标签
本帖最后由 鱼丸儿 于 2017-11-7 10:37 编辑
各位关注杭州黑马的同学们，在经历过HTML组标签的学习后相信大家对HTML的学习与理解有了更深一步的认识与理解。接下来我们来学习一组关于HTML网页结构划分的标签，稍后还会学习HTML标签阶段最为重要的表单标签，希望看官老爷们能跟着小编完成今天的学习任务呦！！！！！
一、框架网页1.1什么是框架网页将一个网页窗口划分为若干个小窗口，每一个小窗口里面都可以存放一个独立的网页！
具体在真实网页中的体现为：
框架网页一般多用于网站的后台管理系统！而上图就是一个网站的真实后台系统截图。
1.2基本用法框架网页是由框架集和框架页组成！框架页是存放于框架集中 也就是说 frame这个标签是放置在frameset这个标签里面
用法如下：
[PHP] 纯文本查看 复制代码
<frameset>
<frame />
<frame />
</frameset>
注意：
当我们在实现框架页面时 frameset这一对标签它就代替了 body标签的功能 ！
frameset标签的属性
1、 rows ：它是用来将一个网页窗口划分为上下型
举例：rows=”180,*” 将一个网页窗口分割为上下型 上窗口占据180个像素 其它的部分都给到下窗口
举例：rows=”180,100,*” 将一个网页窗口分割为上中下型 上窗口占据180个像素 中间的窗口占据100个像素 其它的部分都给到下窗口
2、 cols：它是用来将一个网页窗口分割为左右型
举例：cols=”180,*” 将一个网页窗口分割为左右 左窗口占据180个像素 其它的部分都给到右窗口
举例：cols=”180,100,*” 将一个网页窗口分割为左中右型 左窗口占据180个像素 中间的窗口占据100个像素 其它的部分都给到右窗口
frame标签的属性
src：小窗口中显示网页的地址
name：给小窗口取个名称
noresize：规定无法调用小窗口的大小 取值：noresize
frameborder：是否显示框架周围的边框线 取值：0(不显示)和1 (显示)
接下来我们用一组案例来演示一下框架网页的具体使用方法。
首先我们书写一个框架网页
index.html
[PHP] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>框架网页</title>
</head>
<frameset rows="100,*">
<!--上窗口-->
<frame src="top.html" />
<!--下窗口-->
<frameset cols="100,*">
<frame src="menu.html" />
<frame src="main.html" />
</frameset>
</frameset>
</html>
在本网页中
接下来我们分别书写三个被frame加载的页面，这里注意，以下的三个页面是分别可以单独显示的。[PHP] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body bgcolor="red">
this is top!!!
</body>
</html>
top.html
top.htmlt页面单独的演示效果
同样方式我们在来书写menu.html页面main.html页面
menu.html
[AppleScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body bgcolor="green">
this is menu.html
</body>
</html>
单独显示效果
main.html
[PHP] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body bgcolor="skyblue">
this is main!!!
</body>
</html>
单独显示效果
当我们完成了对三个被加载页面的书写时，这时候我们来访问我们最先完成的index.html 时我们的到一下结果
我们发现当前页面把被frame 加载的三个页面同时在index.html中显示了出来，这便是框架网页的作用。
接下来看官老爷们，也可以高抬贵手，大家一起动手书写一下代码体验一下框架网页的真正奥义。。。。。。
在这里小编再说一遍，接下来要学习的表单在以后的PHP学习中也是有着非常重要的意义，所以各位务必认证学习哦！！！！
二、表单
2.1表单的主要功能表单它主要是用来收集用户输入的相关数据！
首先我们书写一个表单让大家了解一下具体什么是表单
表单初步：
上图中红框中部分就是一个表单
注意：
一个完整的表单，是由“form标签”和“表单控件标签”组成！
而表单控件有很多，我们在下次课程中会着重讲解关于表单控件的相关知识点。
2.2 form标签的属性 action：将表单中收集的用户数据提交给“表单的处理程序”进行相关的处理！这个属性可以不写 如果不写表示将表单的数据提交给当前页面进行处理！
有指明action属性
没有写action属性
method：指表单数据的提交方式 取值：get|post
get：如果说method属性没有书写则默认表示表单数据以“get”方式进行提交 以get方式进行提交的数据会显示在浏览器的地址栏中
显示格式：表单处理程序?name的属性值=用户输入的数据& name的属性值=用户输入的数据
如果使用的是post进行提交的方式 不会将表单数据显示在浏览器的地址栏中 直接发送给表单的处理程序进行处理
接下来是对于get，post总结
get方式与Post方式之间的估缺点：
1、以get方式提交的表单数据 不案例
2、get方式只能提交少量的数据
3、post方式提交的数据相对安全
4、post方式可以提交大量的数据！
具体get，post的使用我们会在后期PHP的课程中进行讲解。
以上便是关于表单中form标签的使用，表单控件标签 关于表单控件的学习我们将在明天的学习中进行讲解。欢迎大家关注学习明天的内容
阅读推荐
【黑马程序员杭州】PHP课程笔记day01-HTML简介及标签
【黑马程序员杭州】PHP课程笔记day02-HTML组标签
【黑马程序员杭州】PHP课程笔记day04表单控件
【黑马程序员杭州】PHP课程笔记day05-CSS基础
作者: PHP老曹 时间: 2017-10-30 10:31
又是慢慢的干货，十分感谢~
作者: 小堂姐姐 时间: 2017-10-30 15:18
期待继续连载
作者: 孙晓威 时间: 2017-10-30 15:22
加油加油
作者: 鱼丸儿 时间: 2017-11-8 10:48
熬夜发帖，大家可还喜欢✺◟(∗❛ัᴗ❛ั∗)◞✺
作者: 猫先森 时间: 2017-11-10 17:03
学习学习学习，生命不息学习不止。感谢大神做的这么细致
| 欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) |
黑马程序员IT技术论坛 X3.2 |
