1.在頁面中寫一個div來存放圖片，.dome是來寫動畫的

1 <div class="iconBox">
2         <div class="picture dome"></div>
3          <p class="title">軟體著作權</p>
4 </div>

 2.動畫效果樣式

　　.iconBox {
        .picture {
          margin: auto;
          width: 88px;
          height: 70px;
          background-image: url("../../static/images/businessArea/fl/fl-icon10.png");
        }
        .dome {
          animation: goBack 0.3s steps(7) forwards;
        }
        @keyframes goBack {
          from {
            background-position: 0 -510px;
          }
          to {
            background-position: 0 0;
          }
        }
    }
    .iconBox:hover .dome {
        .dome {
          animation: mover1 0.3s steps(7) forwards;
        }
        @keyframes mover1 {
          from {
            background-position-y: 0;
          }
          to {
            background-position-y: -510px;
          }
        }
     }
 

3.滑鼠懸浮後的效果