之前在網(wǎng)上看到一些用純CSS3實(shí)現(xiàn)的酷炫效果,以為實(shí)現(xiàn)起來比較困難,于是想看看具體是怎么實(shí)現(xiàn)的。

一、笑臉貓動(dòng)畫

實(shí)現(xiàn)效果如下:

Android培訓(xùn),安卓培訓(xùn),手機(jī)開發(fā)培訓(xùn),移動(dòng)開發(fā)培訓(xùn),云培訓(xùn)培訓(xùn)

這個(gè)實(shí)現(xiàn)起來確實(shí)比較麻煩,很多地方需要花時(shí)間,有耐心地調(diào)整。

1.先看下頁面結(jié)構(gòu):

Android培訓(xùn),安卓培訓(xùn),手機(jī)開發(fā)培訓(xùn),移動(dòng)開發(fā)培訓(xùn),云培訓(xùn)培訓(xùn)

<body>
  <div class="container">
    <!-- 臉 -->
    <div class="face">
      <!-- 頭發(fā) -->
      <div class="hair">
        <div></div>
      </div>
      <!-- 眼睛 -->
   &nbs
        
		

網(wǎng)友評(píng)論