学习HTML第三十三天

学习文章目录

一.fieldset legend 的使用(了解)

fieldset 可以为表单控件分组、 legend 标签是分组的标题

二.表单总结

form表单:

action 属性: 表单要提交的地址

target 属性: 要跳转的新地址打开位置; 值: _self 、 _blank

method 属性: 请求方式,值: get 、 post

input多种形式的表单控件:

type 属性: 指定表单控件的类型

值: text 、 password 、 radio 、 checkbox 、 hidden 、 submit 、 resbutton 等

name 属性: 指定数据名称

value 属性:

对于输入框:指定默认输入的值;

对于单选和复选框:实际提交的数据;

对于按钮:显示按钮文字

disabled 属性: 设置表单控件不可用。

maxlength 属性: 用于输入框,设置最大可输入长度

checked 属性: 用于单选按钮和复选框,默认选中

textarea文本域:

name 属性: 指定数据名称

rows 属性: 指定默认显示的行数,影响文本域的高度

cols 属性: 指定默认显示的列数,影响文本域的宽度

disabled 属性: 设置表单控件不可用

select下拉框:

name 属性: 指定数据名称

disabled 属性: 设置整个下拉框不可用

option下拉框的选项:

disabled 属性: 设置拉下选项不可用

value 属性: 该选项事件提交的数据(不指定value,会把标签中的内容作为提交数据)

selected 属性: 默认选中

button按钮:

disabled 属性: 设置按钮不可用。

type 属性: 设置按钮的类型,值: submit (默认)、 reset 、 button

label与表单控件做关联

for 属性: 值与要关联的表单控件的ID值相同。

fieldset表单边框

三.框架标签

iframe 标签的实际应用:

  1. 在网页中嵌入广告。
  2. 与超链接或表单的 target 配合,展示不同的内容
html 复制代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>框架标签</title>
</head>
<body>
    <iframe src="https://www.taobao.com" width="1300" height="500" frameborder="0"></iframe>
    <iframe src="./小熊猫.png" width="300" height="300"></iframe>
    <br>

    <a href="https://www.bilibili.com" target="tt">点我看B站</a>
    <br>
    <iframe name="tt" frameborder="0" width="1300" height="500"></iframe>
    <br>
    <iframe src="htmls://so.toutiao.com/search" target="tt"></iframe>
        <input type="text" name="keyword">
    <button>提交</button>
    
</body>
</html>
相关推荐
牧艺18 分钟前
从零到协同:构建类飞书在线文档系统的五个技术重难点
前端·人工智能
用户35218024547527 分钟前
当 Prompt 学会"热更新":Spring Boot × Nacos3 AI 实战
java·spring boot·ai编程
红尘散仙1 小时前
想写一个像样的终端 App?试试把 React 的开发体验搬进 Rust TUI
前端·rust
袋鼠云数栈UED团队2 小时前
一套 Spec-First 的 AI 编程工作流
前端·人工智能
袋鼠云数栈前端2 小时前
一套 Spec-First 的 AI 编程工作流
前端·ai+
angerdream2 小时前
Android手把手编写儿童手机远程监控App之vue3 路由守卫
前端
不服老的小黑哥2 小时前
AI规范驱动编程-harness工程项目实战
前端
vivo互联网技术2 小时前
从 Web 到桌面:基于 Tauri 2.0 + Vue 3 打造 vivo 线下门店「大头贴」拍照体验系统
前端·rust
光影少年2 小时前
React 合成事件机制、和原生事件区别、事件冒泡阻止
前端·react.js·掘金·金石计划
没有鸡汤吃不下饭2 小时前
告别手动对接口:我用 OpenAPI JSON 做了一个前端接口同步 Skill
前端·ai编程