嵌入框标签html,【HTML篇】4.HTML的内嵌标签、框架标签、表单

1.内嵌标签:

iframe:

src:要显示的网络资源路径

可以是本地资源(相对路径)也可以是网络资源(url)

注:默认当前页面打开及加载src指向的资源

width:设置显示区域宽度

height:设置显示区域高度

name:设置内嵌区域的名字,结合超链接标签的target属性使用

注:在当前网页中加载其他网页的资源,达到不同网页资源之间不相互干扰,并能在同一个页面中展现给用户的目的.

例:

21a4baac03cb71c870a2c1a081423d4b.png

2.框架标签:

注:第一步一定要删除body标签

frameset

rows:按照行进行切分页面

cols:按照列进行切分页面

子标签:

frame:进行切分区域的占位,一个frame可以单独加载网页资源.

src:资源路径(本地或者网络)

name:区域名,结合超链接使用

例:

ca68627cad761626cd1e38d64cbce89b.png

3.form标签

1.form表单标签学习:

作用:收集并提交用户数据给指定服务器

属性:

action:收集的数据提交地址也就是URL

method:收集的数据的提交方式

get :适合小量数据,表单数据以?隔开拼接在URL后面,不同的键值对使用&符号隔开,不安全.

post:适合大量数据,安全,隐式提交

注:

1.表单数据的提交,要提交的表单项必须拥有name属性值,否则不会提交.

2.提交的表单项数据为键值对,键为name属性的值,值为用户书写的数据

3.form标签会收集其标签内部的数据

4.form表单的数据提交需要依赖于submit提交按钮.

2.form表单域标签学习:

作用:给用户提供可以进行数据书写或者选择的标签.

使用:

1.文本框input:

type:

text  收集少量的文本数据,用户可见

password  收集用户密码数据

属性:

name:数据提交的键,也会被js使用

value: 默认值

2.单选框input:

type:radio

属性:

name:name属性值相同的单选框只能选择一项数据

value:要提交的数据

checked:checked 使用此属性的单选默认是选择状态

3.多选框input:

type:checkbox

属性

name:一个多选组需要使用相同的name属性值

value:要提交的数据

checked:checked 使用此属性的多选框默认是选择状态

4.单选下拉框select:

属性:

name:数据提交的键名,必须声明

value:要提交的数据

子标签option:一个option标签表示一个下拉选项

5.文本域:

textarea:声明一个可以书写大量文字的文本区域

属性:

name:数据提交的键名,js和css也会使用

rows:声明文本域的行数

cols:声明文本域的列数

6.普通按钮input:

type:button

属性:name,value

7.隐藏标签input

type:hidden

属性:name,value

注意:表单数据提交提交的是表单域标签的value值

3.form表单标签的使用:

在点击数据提交时,form标签会将其内部所有form表单域标签中用户书写的数据按照method指明的提交方式

提交给action属性所指明的提交地址.

例:

48e73719ce483602ddd522474a8fa467.png

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值