一、多媒体
音频:
src: url;要播放的音频的URL。
autoplay:autoplay; 如果出现该属性,则音频在就绪后马上播放。
视频:
MP4 : video/mp4 ; WebM : video/webm ; Ogg : video/ogg ;
autoplay: autoplay ; 如果出现该属性,则视频在就绪后马上播放。
controls : controls ; 如果出现该属性,则向用户显示控件,比如播放按钮。
height:pixels ; 设置视频播放器的高度。
width : pixels ; 设置视频播放器的宽度。
src :url ; 要播放的视频的URL。
二、画布
创建画布:
1、画矩形:
var can = document.getElementById("");
var con = can.getContext("2d");
con.fillStyle = "" //设置颜色
con.fillRect(x,y,width,height) //设置矩形显示的尺寸
2、画线段:
var can = document.getElementById("");
var con = can.getContext("2d");
con.moveTo(x,y); //起始坐标位置
con.lineTo(x,y); //结束坐标位置
3、画圆:
var can = document.getElementById("");
var con = can.getContext("2d");
con.beginPath();//开始画圆
con.arc(圆心x,圆心y,半径r,开始弧度,结束弧度);//顺时针
con.strokeStyle = "white"; //设置空心圆颜色.
con.stroken(); //开始绘制
con.closePath();//结束画圆
4、渐变 矩形:
var can = document.getElementById("");
var con = can.getContext("2d");
var grd = con.createLinearGradient(开始x,开始y,结束x,结束y);//创建一个渐变矩形
grd.addColorStop( 0 , 开始渐变颜色);
grd.addColorStop( 1, 结束渐变颜色);
con.fillStyle = grd; //实心矩形颜色方案为grd
con.fillRect(x,y,width,height);//这个渐变图形在画布上的坐标。
5、渐变 圆形 :
var can = document.getElementById("");
var con = can.getContext("2d");
var grd = con.createRadialGradient(开始的圆心x,开始的圆心y,开始的圆半径,结束的圆心x,结束的圆心y,结束的圆半径);
//创建一个渐变圆 。 实际上就是一个圆向另一个圆渐变!
grd.addColorStop( 0 , 开始渐变颜色);
grd.addColorStop( 1, 结束渐变颜色);
con.fillStyle = grd; //实心矩形颜色方案为grd
con.fillRect(x,y,width,height);
三、HTML5 表单
//数字
//URL
//邮箱
//颜色拾取
//日期选择
//范围
min 最小 , max 最大 , placeholder 默认提示 , autocomplete 自动提交
autofocus 自动聚焦 , novalidate 提交时不要验证(默认自动验证)四、CCS3
CSS3 有如下特性:
1、:in-range 范围内 2、:out-range 范围外
3、:valid 通过 4、:invalid 没有通过
5、:enabled 可以填写 6、:disabled 禁用元素
7、:required 必填选项 8、:optional 可选(默认)
9、:read-only: 只读 10、:nth-of-type 选择器
11、[属性^=值] 选择器匹配元素属性值带指定的值开始的元素。
注意:从最开始匹配,从左往右
12、[属性$=值] 选择器同理,匹配元素属性值带指定的值结尾的元素。
注意:从最后开始匹配,但是还是从左往右数
13、[属性*=值] 选择器匹配元素属性值包含指定值的元素。
注意:只要出现匹配值,就会被匹配
14、元素1~元素2 选择器匹配出现在 元素1 后面的 元素2。元素1 和 元素2 这两种元素必须具有相同的父元素。总结:
我感觉,在多行代码的程序中,很需要一种整体思路,需要把所有的变量都联系在一起去写,要不然就会不能实现最终的效果。经过我们自己写出的代码和老黄写的 一比较,很明显的就看出了,老黄的代码很精练,把所有有可能会变得一些参数都定义了变量,放在了一起,这样写,在之后如果要改变一些效果,就能很快捷的, 通过改变变量的值来实现不同的效果,这样就不用去代码里面改变一些逻辑语句。