0326 iframe和video experience
今天的东西确实不少，很容易混淆，input下的属性太多，form下的属性也不少，内容多点，一时不能熟练掌握，晚上多拿出点时间练练 尤其是 form 和inpu那些属性格外别扭
下午的内嵌视频相对简单
主要就是
<iframe name="标签起个名字" src="嵌套的网页地址" frameborder="0"></ifram>
视频标签: <video> 属性：src:地址 controls:控制条 autoplay：自动播放 loop：循环播放
最后讲的 网页标题格式
<link rel="icon" type="image" herf="a.ico">
form 表单标签：五个属性
name、action、method、enctype
<form action="所有表单值提交的地址"
提交方式："method"（默认get提交）">
1.get:
所有表达方式以键值成对的方式 key=value 传递后台。所有信息都在地址栏全部显示 url:
2.post 不会显示表单数据 安全，传递内容大小无限制
--------------------------------
表单元素通用格式：
<input type="表单元素的类型" name="键" value="值">
“type”属性值 表单元素类型：
1.文本类型：
text:单行文本框
password:密码框
hidden:隐藏域
placeholder:带有占位符文本的文本区域
2.按钮类型：
button:普通按钮
submit:提交按钮 （一点就会将整个form标签提交）
reset:重置按钮
image:图像形式的提交按钮
3.单选、多选类型：
radio:单选（必须搭配name属性使用）例：性别：男 女 必须都用sex
label:标签的使用（点文字也可以选上）一个label标签只对一个文本起作用
checked:默认选中
disabled 属性 不可编辑
checkbox:复选框(多选)
4.file:文件上传 (必须在form标签中加enctype="multipart/form-data")
加上后是传到服务器的效果，不是显示效果
下拉框标签：（嵌套标签）
<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
</select>
select属性：是默认选中
需要注意的是 下拉框和表单标签都有 默认选中
下拉框的默认选中是：select
表单的..........:checked
文本域标签：
<textarea>
下午：iframe和video标签
块元素： 独占一行叫块元素 如：h1~h6、hr、ul、ol、div
行内元素：不独占一行 如：b、u、i、strong、a、img
内嵌框架标签：<iframe>
<iframe name="标签起个名字" src="嵌套的网页地址" frameborder="0"></iframe>
视频标签: <video></video>
属性：
src:地址
controls：控制按钮
autoplay:自动播放
loop:循环播放
----------------
网页标题图标格式：
<link rel="icon" type="image" href="a.ico"/>
--> <body>
<a href="first.html" target="myhtml">天气</a>
<a href="second.html" target="myhtml">新闻</a>
<a href="third.html" target="myhtml">图片</a>
<br>
<iframe src="first.html" frameborder="1" width="800px" height="800px" name="myhtml"></iframe> <video src="https://f.us.sinaimg.cn/003AB6sslx07syYD88Pe01041205gyIW0E020.mp4?label=mp4_hd&template=852x480.20.0&Expires=1553583608&ssig=4qf4FFC%2BR1&KID=unistore,video" controls="" autoplay=></video> <form action="#" method="get" enctype="multipart/form-data">
用户名：<input type="text" name="username" id="" value="" placeholder="请输入用户名"/>
<br>
<br>
密码：<input type="password" name="pwd" id="" value="" placeholder="请输入密码"/>
<br>
隐藏域：<input type="hidden" name="uid" id="" value="123" />
<br>
<input type="button" name="" id="" value="普通按钮" />
<input type="submit" name="" value="提交按钮"/>
<input type="reset" name="" id="" value="重置按钮" />
<br>
性别：<label>男：<input type="radio" name="sex" id="" value="" checked=/></label>
<label>女：<input type="radio" name="sex" id="" value="" /></label>
<br>
爱好：
<label>足球：<input type="checkbox" name="hobby" id="" value="footbal" /></label>
<label>篮球：<input type="checkbox" name="hobby" id="" value="basketball" /></label>
<label>毽球：<input type="checkbox" name="hobby" id="" value="jianqiu" /></label>
<br>
文件上传
<input type="file" name="" id="" value="" />
<br>
地址：
<select name="address">
<option value ="zhangdian" selected>张店区</option>
<option value ="zhoucun">周村区</option>
<option value ="zichuan" >淄川区</option>
</select>
<br>
<textarea rows="20" cols="30" name="text1">
</textarea>
</form>
作业表格表单制作
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table bgcolor="darkgrey" border="1" width="973" height="647" cellpadding="" cellspacing="0" align="center">
<tr>
<td colspan="3">1.会员登录名和密码</td>
</tr>
<tr>
<td align="right">用户名</td>
<td colspan="2"><input type="text" name="username" value="" placeholder=""><font color="red"><small>*</font><input type="button" value="检测用户名">
<small><font color="blue">5-15位，请使用英文字母（a-z,A-Z)数字（1-9）</font></small></td>
</tr>
<tr>
<td align="right">密码:</td>
<td><input type="text" name="username" value="" placeholder=""></td>
<td><font color="red"><small>*</font>
<small><font color="blue">5-15位，请使用英文字母（a-z,A-Z)数字（1-9），注意区分大小写；密码不能与登录名相同；易记；难猜..</font></small></td>
</tr>
<tr>
<td colspan="2" align="right"><font color="blue">再次输入密码</font></td>
<td><input type="text" name="username"/> <small>*两次输入的密码必须一致</small></td>
</tr>
<tr>
<td colspan="3">2.姓名和联系方式</td>
</tr>
<tr>
<td align="right">真实姓名</td>
<td colspan="2">
<input type="text" name="username" value="" />
<label>
<font color="red"><small>*</font>
男：<input type="radio" name="sex" value="man" />
</label>
<label>
女：<input type="radio" name="sex" value="woman" />
</label>
</td>
</tr>
<tr>
<td align="right">电子邮箱</td>
<td><input type="text" name="" value="" /></td>
<td><small><font color="red">*非常重要！</font><br><font color="blue">这是客户与您联系的首选方式：请一定填写真实</font></small></td>
</tr>
<tr>
<td align="right">固定电话</td>
<td colspan="2">
<input type="text" name="" id="" value="" /><font color="red"><small>*</font><font color="blue">区号+电话号码</small></font></td>
</tr>
<tr>
<td align="right">公司所在地址：</td>
<td colspan="2">
<select>
<option value ="北京"></option>
<option value ="上海"></option>
</select>
<select>
<option value ="东城"></option>
<option value ="浦东"></option>
</select>
</td>
</tr>
<tr>
<td align="right">街道地址</td>
<td colspan="2"><input type="text" /><font color="red"><small>*</font>
<font color="blue">填写县（区）、街道、门牌号</small>
</td>
</tr>
<tr>
<td align="right">传真号码：</td>
<td colspan="2"><input type="text"></td>
</tr>
<tr>
<td align="right">电话号码：</td>
<td colspan="2"><input type="text"></td>
</tr>
<tr>
<td align="right">邮政编码：</td>
<td colspan="2"><input type="text"></td>
</tr>
<tr>
<td colspan="3" align="left"> <font color="darkgray">3.公司名称和主营业务</font></td>
</tr>
<tr>
<td align="right">贵公司名称：</td>
<td><input type="text"/></td>
<td><font color="red">*</font><small><font color="blue">请填写在工商局注册的名称<br>无商号的个体经营者填写执照上d的姓名，如张三（个体经营）</small></font></td>
</tr>
<tr>
<td align="right">您的职位</td>
<td colspan="2"><input type="text" /><font color="red">*</font></td>
</tr>
<tr>
<td align="right">固定电话：</td>
<td colspan="2"> <font color="red">*</font><small><font color="blue">区号+电话号码</font></small></td>
</tr>
<tr>
<td align="right">主营行业：</td>
<td>
<select>
<option value="dianzidiangong">电子电工</option>
<option value="jixiezhizao">网维运维</option>
</select>
</td>
<td>
<font color="#191CBC"><small>请正确选择，您会收到该行业的供求信息</small></font>
</td>
</tr>
<tr>
<td align="right">
主营产品/服务：</td>
<td>
<input type="text"></td>
<td>
<font color="red">*</font>
<font color="blue"><small>3个主要产品名/服务名，最少要填一个，例如：太阳能、拉链、布料</small></font></td>
</tr>
<tr>
<td align="right">公司网址：</td>
<td colspan="2"><input type="text" value="http://"></td>
</tr>
<tr>
<td> </td>
<td colspan="2">
<input type="submit" value="提交">
<input type="reset" value="重置">
</td>
</tr>
<tr>
<td colspan="3"><center><b>备注：<font color="red">*</font>为必填项</b></center></td>
</tr>
</table>
</body>
</html>
0326 iframe和video experience的更多相关文章
- 表单/iframe与video标签
<form action="所有表单值提交的地址" method="传值的方式默认是GET方式,还有另一种POST方式"> 表单元素</for ...
- iframe中video没有全屏按钮
HTML内联框架元素 <iframe> iframe默认不允许全屏, 如果内嵌了video那么控制条上将不显示全屏按钮, 通过添加allowfullscreen属性可以开启全屏功能. mo ...
- Extjs4使用iframe注意事项
"video" : { render : function(panel, eOpts) { // 因为iframe在video // panel渲染的时候就已经完全移动到video ...
- 在iframe框架中全屏不好使的原因
遇到的问题:我是在iframe框架中添加了一个插件在360和火狐中不好使,将allowfullscreen="true" 属性配置好就没问题了: 可能出现的原因:将allowful ...
- 父页面向iframe子页面传递参数
父页面: <iframe src="video.html" width="100%" height="400" name=" ...
- IE block my cookie in iframe
---恢复内容开始--- There is a severe bug that a leader figured it out in a published project. In IE11, the ...
- iframe子页面获取父页面的点击事件
子页面a.php代码如下: <a href="ad.php" id="pic_ad" target="_blank"><i ...
- Jquyer相册
点击图片然后弹出相册列表,效果如下: html代码: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml&q ...
- [转]Build beautiful, responsive sites with Bootstrap and ASP.NET Core
本文转自:https://docs.microsoft.com/en-us/aspnet/core/client-side/bootstrap?view=aspnetcore-2.1 Bootstra ...
随机推荐
- Linux：不同文件相同列字符合并文件（awk函数）
存在file1.txt,其内容如下: H aa 0 0 1 -9 H bb 0 0 2 -9 H cc 0 0 2 -9 存在file2.txt,其内容如下: H aa 0 0 0 -9 asd qw ...
- FFT的一种迭代实现
struct Complex { double x,y; Complex(double x1=0.0 ,double y1=0.0) { x=x1; y=y1; } Complex operator ...
- （贪心）P1223 排队接水 洛谷
题目描述 有n个人在一个水龙头前排队接水,假如每个人接水的时间为Ti,请编程找出这n个人排队的一种顺序,使得n个人的平均等待时间最小. 输入输出格式 输入格式: 输入文件共两行,第一行为n:第二行分别 ...
- mysql5.6安装优化实例
[client]port = 3306socket = /tmp/mysql.sock[mysqld]log-bin = /data/mysql/bin/mysqlbinlogserver-id = ...
- 三台机器之间root用户ssh互信配置
三台机器之间root用户ssh互信配置 (1)在所有的主机上执行:ssh-keygen -t rsa # 在每台都需要操作,一路回车 (2)将所有机子上公钥(id_rsa.pub)导到一个主机的/ro ...
- Tensorflow object detection API 搭建物体识别模型（二）
二.数据准备 1)下载图片 图片来源于ImageNet中的鲤鱼分类,下载地址:https://pan.baidu.com/s/1Ry0ywIXVInGxeHi3uu608g 提取码: wib3 在桌面 ...
- Elastic Stack之Logstash进阶
Elastic Stack之Logstash进阶 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.使用GeoLite2和logstash 过滤插件的geoip案例 1>. ...
- Docker CE 各安装方法
1.Docker CE 镜像源站 使用官方安装脚本自动安装 curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun 2.U ...
- namenode format
https://community.hortonworks.com/content/supportkb/48981/how-to-recover-namenode-ha-when-one-accide ...
- NIO SocketChannel 【链接】
Java NIO系列教程(一) Java NIO 概述 Java NIO系列教程(六) Selector Java NIO系列教程(二) Channel Java NIO系列教程(三) Buffer ...