web学习第二天

今天是学习web的第二天，早上用css3做了个会动的小熊，border-radius为圆的半径，

.smallxiong {
    width: 400px;
    height: 400px;
    background: cadetblue;
    border-radius: 200px;
    position: relative;
    transition: transform 2s;
   }
   .smallxiong:hover{
    transform: rotate(720deg);
   }

这段代码是小熊运动的主要原因，能动起来，主要是因为两秒前后的图片位置不一样，就可以动起来

.tupian {
    width: 600px;
    height: 600px;
    background: red;
    animation: bian 6s linear infinite;
    transition: transform 2s;
    img src: url(img/0.jpg);
   }
   .tupian:hover{
    transform: matrix(720deg);
   }
   @keyframes bian {
    30% {
     width: 1200px;
     height: 600px;
     background: url(img/0-FlmELJ.jpg);
     background-size: 100% 100%;
    }

这段代码使得小熊可以运动起来， animation: bian 6s linear infinite; 然后@keyframes bian，这俩句话是运动的核心

下午的作业是做小米的官网，要美化并详细，主要是结尾的做法，做这个界面，整体上跟昨天做的内个小米商城界面差不多一样，也不是很难，

就是在最后的内个li标签又遇到了问题，float left 有时候就成功不了，很是难受，把每一个li标签的内容改了 才实现了功能

今天还学到了相对定位 和 绝对定位的使用方法，position relative 和 position absolute 两个一起使用 为相对定位 单一使用为绝对定位