初学HTML–表单标签form和内联框架

表单的创建

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <!-- 表单标签form 有若干输入选择组件,用于用户填写后,提交至服务器 在form标签的属性: action="服务器地址" method="提交方式 post/get" --> <form> <!-- <input type="text"> 单行文本输入框 placeholder="请输入账号" 在文本框中提示,输入内容后被覆盖 readonly="readonly" 只读,但可提交 disabled="disabled" 禁用,不可提交 id:为标签定义id号,唯一不可重复.,自定义 <lable for="id">账号</lable> 为id定义标签,通过点击可以选中对应的输入框 size:文本框的列数 value:向服务器提交的值 name:可重复,自定义 --> <label for="账户">账号:</label> <input type="text" id="账户" placeholder="请输入账号" value=""/><br/> <label for="邮箱">邮箱:</label> <input type="email" id="邮箱" placeholder="请输入邮箱" disabled="disabled"/><br/> <label for="密码">密码:</label> <input type="password" id="密码" placeholder="请输入密码" readonly="readonly"/><br/> <!-- 单选框:type="radio" 复选框:type="checkbox" 相同点: 通过name实现分组,name相同的为一组 凡选择性组件必须基于默认值 eg:value="男" 默认选中:checked="checked" 不同点: 单选框只能选一个,组内相互排斥 复选框可多选 --> <!-- 单选框 男||女 默认选项:男--> 性别: <input type="radio" value="男" name="sex" id="男" checked="checked"/> <label for="男">男</label> <input type="radio" value="女" name="sex" id="女"/> <label for="女">女</label><br /> 擅长语言: <!-- 复选框 Java || C || html 默认选项checked="checked" --> <input type="checkbox" value="Java" name="course" id="Java" checked="checked"/> <label for="Java">Java</label> <input type="checkbox" value="C" name="course" id="C" checked="checked"/> <label for="C">C</label> <input type="checkbox" value="html" name="course" id="html" checked="checked"/> <label for="html">html</label> <!-- select 下拉框 name属性写在select中 option为选项中的内容 提交后option中的value会与selecname结合提交至服务器 selected="selected"默认选择 --> 省份: <select name="prinvince"> <option value="101">北京</option> <option value="102">天津</option> <option value="103" selected="selected">河北</option> <option value="104">武汉</option> </select><br /> <!-- type="file"上传文件 accept=".文件格式"限制文件格式 --> 附件: <input type="file" accept=".png" /><br /> <!-- 多行文本域textare rows="number"行数 cols="number"列数 --> 详细地址: <textarea rows="3"> 陕西省西安市 </textarea><br /> <!-- type="reset"重置按钮,还原网页初始状态 type="submit"提交按钮,触发表单提交动作 type="button"普通按钮,触发事件,调用js函数 --> <input type="reset" value="再来一遍" /> <input type="submit" value="那就这样吧" /> <input type="button" value="简简单单才是真" /><br /> </form> </body> </html> 

内联框架

 <!-- 内联框架<iframe src="嵌套窗口"></iframe> 在窗口中嵌套另一个窗口,从而在窗口中引出另一个窗口 创建的子窗口中定义name="子窗口", 通过超链接target="子窗口",使其打开方式为在子窗口打开 --> 父网页 <a href="http://www.baidu.com" target="z1">百度</a> <iframe src="http://www.qq.com" name="z1" frameborder="1"></iframe> 

总结

表单:

1.创建表单<form></form>
属性有:action=”服务器名” method=”post/get”

2.<input type="text"/>单行文本输入框
type类型有多种
单选框:type=”radio”
复选框:type=”checkbox”
3.placeholder=”在输入框中显示的内容” 在用户输入内容后会被覆盖
4.readonly=”readonly”只读,可以提交
5.disabled=”disabled”禁用,且不可提交
6.id:为标签自定义id号,唯一不可重复
7.<label for="id号">账号:</label> 配合id使用,通过点击账户两个字对输入框进行输入
8.size=”number” 文本框的列数
9.value:向服务器提交的值
10.name可重复,自定义,为标签定义别名
11.<select name=""></select>下拉框
12.<option value=""></option>下拉框中的选项,提交后option中的value会与select中的name结合提交至服务器
13.selected=”selected”默认选择
14.type=”file”上传文件
accept=”文件名.文件格式”限制上传文件的格式
15.<textarea></textarea>多行文本域
rows=”number” 设置列数
cols=”number”设置行数
16.type=”reset”重置按钮,还原网页初始状态
type=”submit”提交按钮,触发表单提交动作
type=”button”普通按钮,触发事件,调用js函数

内联框架
1在网页中创建子窗口<iframe src="嵌套的窗口"></iframe>
2.在iframe中通过name定义子窗口的名字
3.在父窗口的超链接中通过target=”定义名”,使其打开方式在子窗口中打开

原文链接:https://www.cnblogs.com/xiaofanmi/p/14774537.html

原创文章,作者:优速盾-小U,如若转载,请注明出处:https://www.cdnb.net/bbs/archives/32899

(0)
优速盾-小U的头像优速盾-小U
上一篇 2025年7月26日 13:05
下一篇 2025年7月26日 22:10

相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

优速盾注册领取大礼包www.cdnb.net
/sitemap.xml