iframe内联框架
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>内联框架</title>
</head>
<body>
<!--iframe-->
<!--<iframe src="//player.bilibili.com/player.html?aid=600787397&bvid=BV1GB4y1p7N1&cid=770572636&page=1"-->
<!-- scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> -->
<!--</iframe>-->
<!--src：引用页面地址
name：框架标识名-->
<iframe src="https://www.bilibili.com/" name="bilibili" frameborder="0" width="700px" height="700px"></iframe>
<iframe src="" name="longshare"></iframe>
<a href="http://www.longshare.com/" target="longshare">点击跳转</a>
<!--在iframe中不增加src地址并用name命名；用a增加一个内联标签，在target中输入name参数的值，
表示该链接的网站使用name指向的框架跳转-->
</body>
</html>
##表单
form
有两个必填参数，method：规定如何发送表单数据，get/post
action：表示向何处发送表单数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录注册</title>
</head>
<body>
<h1>ikun注册</h1>
<!--表单form
action：表单提交的位置，可以是网站也可以是一个请求处理地址
method：post，get提交方式
get方式提交，我们可以在url中看到提交的信息。不安全但高效
post：比较安全，传输大文件-->
<!--<form action="第一个网页" method="get"></form>-->
<form action="第一个网页" method="post"></form>
<!--文本输入框：text
初始值：value="Mood好帅"
最长写几个字符maxlength="8"
文本框长度：size="30"
只读：readonly
禁用：disabled 单选、多选、提交等
隐藏：hidden，依然存在但无法看见
如input type="password" name="pwd" hidden value=”123456“
-->
<p>名字：<input type="text" name="username" value="坤坤"></p>
<!--密码框：password-->
<p>密码：<input type="password" name="pwd"></p>
<!--单选框标签
input type="radio"
value：单选框的值
name属性：表示组，name相同则表示分为一组
checked 默认选中-->
<input type="radio" value="boy" name="sex"/>男
<input type="radio" value="girl"name="sex"/>女
<input type="radio" value="unknown"name="sex"/>不详
<!--多选框
checked 默认选中-->
<p>
爱好：
<input type="checkbox" value="sing" name="hobby">唱
<input type="checkbox" value="jump" name="hobby">跳
<input type="checkbox" value="rap" name="hobby">rap
<input type="checkbox" value="basketball" name="hobby">篮球
</p>
<!--按钮
input type="button" 普通按钮
input type="image" 图像按钮
input type="submit" 提交按钮
input type="reset" 重置按钮
-->
<!--<p>按钮：-->
<!-- <input type="button" name="btn1" value="点击展示">-->
<!-- <input type="image" src="../resource/image/test_HTML_p1.jpeg">-->
<!--</p>-->
<h2>才艺</h2>
<p>
<iframe src="" name="kun" width="700px" height="500px"></iframe>
<a href="https://www.bilibili.com/video/BV11Z4y1e7VT?spm_id_from=333.337.search-card.all.click&vd_source=fa1c89f86166f6687e38fe0a82f46fa7"
target="kun">
<input type="button" name="btn1" value="点击展示">
</a>
</p>
<!--value可以给表单按钮赋值-->
<!--列表框
option：选项
selected：默认选项-->
<p>
活动标签：
<select name="下拉框" id="">
<option value="kunkun" selected>鸡哥</option>
<option value="ikun">ikun</option>
<option value="xiaoheizi">小黑子</option>
<option value="begin">开团</option>
</select>
</p>
<!--文本域
col 列
row 行-->
<p>
反馈：
<textarea name="textarea" cols="40" rows="5">巅峰诞生虚伪的拥护，黄昏见证虔诚的信徒</textarea>
</p>
<!--文件域-->
<p>
<input type="file" name="files">
<input type="button" value="上传" name="upload">
</p>
<!--邮件验证-->
<p>邮箱：
<input type="email" name="email">
</p>
<!--url验证-->
<p>URL：
<input type="url" name="url">
</p>
<!--数字验证-->
<p>kun龄：
<input type="number" name="num" max="100" min="0" step="3">
<!-- step表示步长-->
</p>
<!--滑块
input type="range"-->
<p>滑块：
<input type="range" name="voice" min="0" max="100" step="5">
</p>
<!--搜索框-->
<p>搜索：
<input type="search" name="search">
</p>
<!--增强鼠标可用性-->
<label for="mark">点我就开团</label>
<input type="text" id="mark" placeholder="每人十张">
<!--表单验证
placeholder：提示性信息 用在输入框中
required：非空判断
pattern：正则表达式-->
<p>自定义ikun邮箱
<input type="text" name="email" pattern="^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$">
</p>
<p>
<input type="submit">
<input type="reset">
</p>
</body>
</html>
表单元素格式
| 属性 | 说明 |
|---|---|
| type | 指定元素的类型：text、password、checkbox、radio、submit、reset、file、hidden、image和button，默认为text |
| name | 指定表单元素的名称 |
| value | 元素的初始值，其中type为radio时必须指定一个值 |
| size | 指定表单元素的初始宽度；当type为text或password时，表单元素的大小以字符为单位；其他类型，宽度以像素为单位 |
| maxlength | type为text或password时输入的最大字符数 |
| checked | type为radio或checkbox时，指定按钮是否被选中 |
###表单的应用
- 隐藏域：hidden
- 只读：readonly
- 禁用：disabled
###表单初级验证
常用方式：
- placeholder：提示性的消息
- required：非空判断
- pattern：正则表达式
1124
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
