HTML5和CSS3

HTML5

  就是html，只是升级了，多加了几个标签而已

选择器

  document.querySelectorAll（）；
  document.querySelector（）；

自定义属性

  data-xxx
  dataset.xxx

class操作

  classList    有length  value
  操作：add（）  添加
       remove（） 删除
       contains（）包含
      toggle（） 切换

CSS3

  就是比css2新增加了一些新的样式
        rgba（）；
      border-radius   圆角
      box-shadow   盒子阴影[inset] x偏移 y偏移 阴影范围 [扩展] color  
      text-shadow   文字阴影[inset] x偏移 y偏移 阴影范围 [扩展] color
      阴影可以叠加

浏览器前缀

      -webkit-        Chrome/Safari/opear/firefox(49+)
      -moz-       Firefox
      -ms-        IE
      -o-      Opear(old)
      不加前缀    W3C

运动

    transition：速度（s） 要动的属性  移动的方式

变形

    transform：
    translate（x，y）  平移
    rotate（deg）    旋转（z轴）
    scale（x倍，y倍）  缩放
    skew  （xdeg，ydeg）   拉伸

设置原心位置

    transfrom-origin   横向

线性渐变

    linear-gradient（color1，color2）
    改变方向：linear-gradient(方向, color1, color2, color3...);
    范围渐变：linear-gradient(color1 start, color1 end, color2 start, color2 end, color3 start, color3 end...);
    跳变：repeating-linear-gradient(color1 start, color1 end, color2 start, color2 end...);

径向渐变

    radial-gradient(color1, color2);

背景

    background-size

文本切片

    1.给元素设置渐变背景
    2.设置文本切片：-webkit-background-clip: text;
    3.文字透明