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 ...
随机推荐
- 解决plink报错：.bim file has a split chromosome. Use --make-bed by itself to remedy this.
由于plink1.9和1.07这两个版本互掐,经常出现各种不兼容问题,“.bim file has a split chromosome. Use --make-bed by itself to r ...
- 斯坦福大学公开课机器学习： neural networks learning - autonomous driving example（通过神经网络实现自动驾驶实例）
使用神经网络来实现自动驾驶,也就是说使汽车通过学习来自己驾驶. 下图是通过神经网络学习实现自动驾驶的图例讲解: 左下角是汽车所看到的前方的路况图像.左上图,可以看到一条水平的菜单栏(数字4所指示方向) ...
- Codeforces Round #529 (Div. 3) C. Powers Of Two(数学？？？？)
传送门 题意: 给出一个整数 n ,问能否将 n 分解成 k 个数之和,且这 k 个数必须是2的幂. 如果可以,输出"YES",并打印出任意一组解,反之输出"NO&quo ...
- Codeforces Round #523 (Div. 2)
Codeforces Round #523 (Div. 2) 题目一览表 来源 考察知识点 完成时间 A Coins cf 贪心(签到题) 2018.11.23 B Views Matter cf 思 ...
- TestNg-数据驱动-dataProvider
参考https://blog.csdn.net/hjianhui24/article/details/50554828 之前的用例自己一笔一划写出来的,知道了数据驱动的概念之后,修改了一下用例. @D ...
- HDU - 5952 Counting Cliques(DFS)
A clique is a complete graph, in which there is an edge between every pair of the vertices. Given a ...
- memcached 在windows中的部署和使用
第一步:下载memcached 地址:http://www.121down.com/soft/softview-28366.html 第二步:将下载文件解压到文件目录后,打开命令窗口 通过cd命令 ...
- RPC与REST的区别
https://blog.csdn.net/douliw/article/details/52592188 RPC是以动词为中心的, REST是以名词为中心的, 此处的 动词指的是一些方法, 名词是指 ...
- （分治法 快速幂）51nod1046 A^B Mod C
1046 A^B Mod C 给出3个正整数A B C,求A^B Mod C. 例如,3 5 8,3^5 Mod 8 = 3. 收起 输入 3个正整数A B C,中间用空格分隔.(1 < ...
- node(基础)_node中的javascript
一.前言 ...