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 ...
随机推荐
- 象棋start
这篇文章其实谈的不是象棋开局,更谈不上开局技巧,举个例子:第一步走炮二平五,也即是中炮局,但中炮局可以根据对手的应对着法演变成很多,比如:五七炮对屏风马,五六炮对屏风马,顺炮局,以及雷公炮等等,这些才 ...
- python自动化开发-[第八天]-面向对象高级篇与网络编程
今日概要: 一.面向对象进阶 1.isinstance(obj,cls)和issubclass(sub,super) 2.__setattr__,__getattr__,__delattr__ 3.二 ...
- MySQL数据库服务器整体规划(思路与步骤)
MySQL数据库服务器整体规划(思路与步骤) 参考资料: http://blog.51cto.com/zhilight/1630611 我们在搭建MySQL数据库服务器的开始阶段就合理的规划,可以避免 ...
- 选择排序Java版
package dataStructureAlgorithmReview.day01; import java.util.Arrays; /** * * @author shundong * */ p ...
- 关于java文件下载文件名乱码问题解决方案
JAVA文件下载时乱码有两种情况: 1,下载时中文文件名乱码 2,下载时因为路径中包含中文文件名乱码,提示找不到文件 解决方法见下面部分代码 response.setContentType(" ...
- 为什么要两次调用encodeURI来解决乱码问题
.encodeURL函数主要是来对URI来做转码,它默认是采用的UTF-8的编码.. UTF-8编码的格式:一个汉字来三个字节构成,每一个字节会转换成16进制的编码,同时添加上%号. 假设页面端输入的 ...
- layui(六)——upload组件常见用法总结
layui中提供了非常简单的文件上传组件,这里写了一个上传图片的栗子,上传成功后返回图片在服务器的路径,并设置为页面中img的src属性.因为上传十分简单,没什么可说的,就直接上代码了. html代码 ...
- spring-data-redis集成ehcache实现缓存
1.结构 2.pom.xml <?xml version="1.0" encoding="UTF-8"?><project xmlns=&qu ...
- Web前端框架与移动应用开发第七章
1.练习1:焦点图切换 html: <!doctype html><html><head> <meta charset="utf-8" / ...
- UVALive - 7041 The Problem to Slow Down You （回文树）
https://vjudge.net/problem/UVALive-7041 题意 给出两个仅包含小写字符的字符串 A 和 B : 求:对于 A 中的每个回文子串,B 中和该子串相同的子串个数的总和 ...