html\css笔记1

1.data-*自定义属性：html5增加的新功能自定义数据属性

dataset属性存取data-*自定义属性的值

这种方式通过访问一个元素的dataset属性来存取data-*自定义属性的值。这个dataset属性是HTML5 JavaScript API的一部分，用来返回一个所有选择元素data-属性的DOMStringMap对象。使用这种方法时，不是使用完整的属性名，如data-id来存取数据，应该去掉data-前缀。还有一点特别注意的是：data-属性名如果包含了连字符，例如：data-date-of-birth，连字符将被去掉，并转换为驼峰式的命名，转换后应该是：dateOfBirth。删掉data-属性:delete el . dataset . id ;  或者 el .dataset . id = null

2.kbd标签：kbd表示文本是从键盘上键入的。例如:<kbd>D</kbd>

3.audio标签:http://blog.csdn.net/zhouziyu2011/article/details/69084961

css：transition\transform\animation

1.transform 

transdorm-origin定义的是旋转基点

1.1rotate(angle)正数则顺时针，负数逆时针transform:rotate(30deg)（rotate旋转）

1.2移动translate:transform:translate()

移动translate分为三种情况：translate(x,y)水平方向和垂直方向同时移动；translateX(x)仅水平方向移动；translateY(Y)仅垂直方向移动（Y轴移动）。

1.3transform:scale()：含义：比例；“1.5”表示以1.5的比例放大，如果要放大2倍，须写成“2.0”，缩小则为负“-”

---

animation(动画)

动画属性包括：①animation-name，②animation-duration，③animation-timing-function，

以下是各属性详解：

1、animation-name：指定要绑定到选择器的关键帧的名称。

2、animation-duration：定义动画完成一个周期需要多少秒或毫秒

3、animation-timing-function：指定动画将如何完成一个周期。