今天完成的事情：

 1.关于html5 audio标签的使用。在body下，<audio src="地址“</audio>。

   可控特性:autoplay自动播放

         loop循环播放

         controls显示或隐藏界面

         muted是否静音

 2.关于hover控制div显示隐藏。

   实现原理：A元素与B元素有一个相同的父级。

                        B元素默认隐藏，A元素默认显示。当鼠标移动到A元素身上时，也可以看做是移动到了A元素的                             父级身上。A元素的父级获得一个鼠标的hover状态。

        css使用： .father:hover .b { display:block } 的方式，来定义鼠标移动到父级身上时，B元素的样式。

   3.在投票页面的方块实现正方形：

      <div class="vw">hello,viewport</div> .vw {width: 50%;height:50vw;background:#ccc;}

  运用flex布局实现垂直水平居中

flex-flow: wrap ;
justify-content: center;

   4.矢量雪碧图教程：两个关键属性border-position，border-size饿的用法

      http://www.jianshu.com/p/91dc6d5ab88c?hmsr=toutiao.io&utm_medium=toutiao.io&utm_source=toutiao.io

   5.对移动端的页面进行最大宽度设置，max-width。

   6.点击按钮跳转指定页面：

     添加一个事件<a href="你要跳转的页面">点击我跳转</a>      

明天完成的事情：

 完成任务7，开始任务8.

问题：

 关于雪碧图自适应

 移动端的icon大小不是不定的，如果用px固定住，在高分辨率手机中就会变得很小在低分辨率手机中就会变得很大。

   所以手机都拿icon图标需要用百分比来或者用rem布局来调整icon的大小。background-position百分比计算公式：

x：（容器的宽度-图片的宽度）x (50%)
y：（容器的高度-图片的高度）x (30%)

   比如：容器是width：600px；height：600px；而图片是width：200px；height：200px；

.icon{    width: 600px;    height: 200px;    background:#FFF url(image) no-repeat fixed 50% 30%;
}

   动态viewport的使用：

   动态viewport最初是由手淘使用来解决适应各种手机分辨率的一个解决方案：

   会根据手机的分辨率和比率rate生成一个最佳的viewpoint和相对应基准的font-size大小;

收获：

  如上！ 

  使用了新的托管平台-码云！这下不用输入用户名和密码就能查看了！更加优质的网络！更加稳定的托管服务！多语言的支持！免费的私有库！不只是编码，更加注重社会化协作！越优，俞强，只为强者而生！