六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 83|回复: 0

HTML5实践 -

[复制链接]

升级  9.6%

394

主题

394

主题

394

主题

探花

Rank: 6Rank: 6

积分
1192
 楼主| 发表于 2013-1-4 03:07:33 | 显示全部楼层 |阅读模式
<div id="cnblogs_post_body">  今天我们将介绍,如何使用css3完成google涂鸦动画。当你点击demo页面的【开始】按钮之后,页面中的骑手和马匹将会运动起来,http://www.mycookingroom.com/demo/google-doodle-animation-in-css3-without-javascript.html
  这里需要强调的一点是,ie不支持css3的动画属性,再次抱怨下万恶的ie。但是我们不能以此为理由不去拥抱css3。

  我们先来看html代码。
<div class="cnblogs_code"><!DOCTYPE html><html><head>    <title></title>    <link rel="stylesheet" type="text/css" href="css/google-doodle-animation-in-css3-without-javascript.css"/></head><body><div id="logo">    <div class="frame">        <img src="img/muybridge12-hp-v.png"/>    </div>    <label for="play_button" id="play_label"></label>    <input type="checkbox" id="play_button" name="play_button"/>    <span id="play_image">        <img src="img/muybridge12-hp-p.jpg"/>    </span>    <div class="horse"></div>    <div class="horse"></div>    <div class="horse"></div></div></body></html>
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表