html5 + css3

1: 新增标签: header \ NAV \ footer \ artical \ section \ aside

2: datalist

<input type = "text" value = "输入选择" list = "dalist">

<datalist id = "dalist">

  <option>选项一</option>

  <option>选项二</option>

  <option>选项三</option>

</datalist>

3: 多媒体标签: embed :定义嵌入的内容 <embed src = 'donghua.swf'>

  audio: 播放音频

  autoplay自动播放  controls是否显示默认播放控件  loop循环播放,如果不写这个属性默认播放一次,loop/loop = ‘ loop ‘ 表示无限播放

  <audio src = ''/>

  <audio autoplay cotrols loop>

    <source src = "music.mp3" />

    <source src = "music.ogg" />

    您的浏览器不支持音频播放功能

  </audio>

  

  video: 播放视频

  autoplay自动播放  controls是否显示默认播放控件  loop循环播放  width设置播放窗口的宽度  height设置播放窗口的高度

4:transition:要过度的属性 时间 运动曲线(ease逐渐慢下来、linear匀速 ) 何时开始(默认0秒开始);

如果都要过过度直接写 all 。5s 后面的可以省略,选择默认,写在运动前的元素上

transform(变形):translate(50%,50%)移动 、 scrale(1.3,1.3)缩放 、 rotate(deg)旋转 、 skew(deg,deg)倾斜

animation(过渡动画):move 2s ease 。5s infinite(无线播放) alternate(默认是);动画名称-花费时间-运动曲线-何时开始-播放次数-是否反方向

animation-play-state: paused; 暂停动画

@keyframes move {

    from {

      left: 0;

      background-color: #000000;

    }

    to {

      left: 1000px;

      background-color: #ffffff;

    }

@keyframes move {

    0% {

      left: 0;

      background-color: #000000;

    }

    50% {

      left: 1000px;

      background-color: #ffffff;

    }

    100% {

      left: 0;

      background-color: #000000;

    }

猜你喜欢

转载自www.cnblogs.com/pxxdbk/p/12502301.html