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

1.内嵌标签:

iframe:

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

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

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

  width:设置显示区域宽度

  height:设置显示区域高度

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

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

例:

2.框架标签:

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

frameset

  rows:按照行进行切分页面

  cols:按照列进行切分页面

  子标签:

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

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

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

例:

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属性所指明的提交地址.

例:

(0)

相关推荐

  • HTML基础-01

    HTML基础知识 HTML:超文本标记语言,是一种使用结构化Web网页(标准制定者:W3C)及其内容的标记语言. 发展过程:XHTML5,HTML5,XHTML1.0,HTML4.01,HTML3.2 ...

  • 前端入门—HTML篇(秃头之路正式开启)

    前端入门—HTML篇(秃头之路正式开启)

  • 中级Web教程:HTML5表单元素

    网络前端高薪的诱惑,学习门槛低,不管是学生党还是工作者,都渴望凭借自己的能力,空闲的时间,去学前端.也许是一种爱好,也许是一种想从事的工作.但它真的那么简单吗?现在,初级前端的工作,已接近饱和,并处于 ...

  • HTML name、id、class 的区别

    HTML 中name.id.class 的区别:  在一个页面中,有许多的html元素或html标签.为了更方便的操作这些标签,就需要给这些标签标识一个身份. name :指定标签的名称. id:指定 ...

  • WEB前端第五课——HTML表单

    WEB前端第五课——HTML表单

  • 中级Web教程:HTML5表单属性

    网络前端高薪的诱惑,学习门槛低,不管是学生党还是工作者,都渴望凭借自己的能力,空闲的时间,去学前端.也许是一种爱好,也许是一种想从事的工作.但它真的那么简单吗?现在,初级前端的工作,已接近饱和,并处于 ...

  • .NET5 开发手机提词应用,基于内嵌Web服务器及PowerPoint自动化

    今天 以下文章来源于杨中科 ,作者杨中科 项目说明 我使用电脑录制视频教程的时候,会展示PPT给观众,同时也有一些提示性的文字给我自己看.这就类似于很多电视节目录制现场的"提词器" ...

  • 赠高丹宇老师 【内嵌:高丹宇好】

    才高八斗经满腹, 纵论不凡语连珠. 音传古津童叟喜, 诗荡邙山杨柳舞. 书仰高君伴汝眠, 梅思丹青未腊吐. 河崇宇阔浪亦激, 鹤栖好松千年楚. 20161228凌晨

  • 凝樱子辞赋微义好{内嵌

    巾帼佳丽凝群雄, 闭月羞花英姿呈. 天降才女子膜拜, 敢释归去辞来风. 屈原含怨赋离骚, 宋玉谏君微风骋. 李白遭谗义膺愤, 赵薇椽笔好传承.

  • 下府岸人张友茂好 {内嵌}

    居高临下志成城, 身处南府胸涛涌. 辞赋江岸荡春雷, 诗颂高人舞东风. 花甲仍张青年志, 佛心助友跨马腾. 天塑文茂南昌地, 我愿师好百岁程.

  • 七律 诗词歌赋孙迎春好 【内嵌】

    七律  诗词歌赋孙迎春好  [内嵌] 临场题诗雅居中, 龙舞美词威海宫. 引凤高歌天籁伴, 挥毫书赋翠禽隆. 倏然贤孙羽丰满, 腾起喜迎雨后虹. 掬把艳春回目笑. 爷爷夸好万花丛. 注:"诗 ...

  • 全球首个160公里的内嵌式磁浮交通系统正式亮相成都

    全球首个160公里的内嵌式磁浮交通系统正式亮相成都

  • 17.九年级数学:直径为2的大圆,内嵌4个小圆,怎么求阴影部分的面积?

    九年级数学:直径为2的大圆,内嵌4个小圆,怎么求阴影部分的面积?大家先在草稿本上,认真地做一遍,然后再看后面的视频.期待您在评论区留言. 温馨提醒:因为视频内容越来越多,为了更好的把内容进行分类归纳, ...

  • 钢框架内嵌连接轻钢龙骨注浆复合墙板结构抗震性能试验研究

    Writers 王静峰 赵鹏 汪皖黔 鲁萌萌 曹晗 摘要:轻钢龙骨注浆复合墙板作为建筑工业化的低层承重墙板或高层围护墙板,由于其自重轻.易安装,在工程中有很好的应用前景.然而目前国内外尚缺乏在地震作用 ...

  • Ansys Mechanical内嵌nCode疲劳仿真工具

    疲劳分析是分析结构受到周期性载荷作用下,结构应力远小于强度极限情况,甚至结构应力比弹性极限还低的情况下就可能发生破坏的情况.Ansys nCode是国际著名的疲劳耐久性仿真分析软件,其多个版本以前已经 ...