css 让背景图片不停旋转
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.logo {
text-align: center;
margin-top: 100px;
}
@-webkit-keyframes rotation {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
} .Rotation {
-webkit-transform: rotate(360deg);
animation: rotation 8s linear infinite;
-moz-animation: rotation 8s linear infinite;
-webkit-animation: rotation 8s linear infinite;
-o-animation: rotation 8s linear infinite;
} .img {
border-radius: 200px;
}
</style>
</head> <body>
<div class="logo">
<img class="Rotation img" src="http://cdn.jingqueyun.com/turntable/image/theme/theme2/turntable-outer-bg2.png" width="" height=""/>
</div>
</body>
</html>
css 让背景图片不停旋转的更多相关文章
- img只显示图片一部分 或 css设置背景图片只显示图片指定区域
17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...
- CSS中背景图片定位方法
转自:http://www.ruanyifeng.com/blog/2008/05/css_background_image_positioning.html 作者: 阮一峰 日期: 2008年5月 ...
- 类似百度音乐唱片播放时CD图片不停旋转的实现
类似百度音乐唱片播放时CD图片不停旋转的实现 效果图 1 html代码 2 <imgsrc="img/logo.png"class="img-responsive& ...
- CSS中背景图片的background-position中的left top到底是相对于谁的?
在学习的时候遇到了如下问题: CSS中背景图片的background-position中的left top到底是相对于谁的,content-box?padding-box?border-box? ba ...
- (转)HTML&CSS——background: url() no-repeat 0 -64px;CSS中背景图片定位方法
http://blog.csdn.net/oscar92420aaa/article/details/51304067 CSS中背景图片的定位,困扰我很久了.今天总算搞懂了,一定要记下来. 在CSS中 ...
- HTML&CSS——background: url() no-repeat 0 -64px;CSS中背景图片定位方法
CSS中背景图片的定位,困扰我很久了.今天总算搞懂了,一定要记下来. 在CSS中,背景图片的定位方法有3种: 1)关键字:background-position: top left; 2)像素:bac ...
- CSS常用背景图片定位方法
CSS背景图片定位其实对于每一位学习前端的同学来说,都已经非常熟悉了.网上铺天盖地的最常见的一种方案就是在父元素中relative,然后子元素absolute.这种方案当然好,不过带来的一个缺点就是会 ...
- css 设置背景图片模糊,内容不模糊
需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...
- css设置背景图片,ie显示不了
本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...
随机推荐
- java使用POI操作XWPFDocument中的XWPFRun(文本)对象的属性详解
java使用POI操作XWPFDocument中的XWPFRun(文本)对象的属性详解 我用的是office word 2016版 XWPFRun是XWPFDocument中的一段文本对象(就是一段文 ...
- js字符串替换(时间转换)
转: js中字符串全部替换 废话不多说,直接发结果 在js中字符串全部替换可以用以下方法: str.replace(/需要替换的字符串/g,"新字符串") 比如: "yy ...
- day21 数据库(DataBase)
1.数据库由多张表组成,一张表就是一个实体. 2.表的列就是属性的值,行就是一个个具体的对象的属性值. primary key主键:1.非空.2.不能修改(定好不变).3.业务无关. 作用:在表中具体 ...
- Node.js 被分叉出一个项目 — Ayo.js,肿么了
(注:ayo.js叉从Node.js.目前,大量的文档仍然指向Node.js库.) ayo.js是一个JavaScript运行时建立在Chrome的V8 JavaScript引擎.ayo.js使用事件 ...
- Nginx基础配置指令
nginx.conf文件的结构 ... #全局块 events{ #events块 ... } http{ #http块 ... #http全局块 server{ #server块 ... #serv ...
- 戴尔R720xd服务器系统安装前期环境实现
型号:R720xd 开启服务器,Ctrl+R进入raid配置 配置完raid后F2对硬盘进行格式化 保存并重启 F11进入BIOS选项设置U盘启动 选择U盘启动 开始进行系统安装!
- java selenium常用API(WebElement、iFrame、select、alert、浏览器窗口、事件、js) 一
WebElement相关方法 1.点击操作 WebElement button = driver.findElement(By.id("login")); button.clic ...
- 【算法专题】后缀自动机SAM
后缀自动机是用于识别子串的自动机. 学习推荐:陈立杰讲稿,本文记录重点部分和感性理解(论文语言比较严格). 刷题推荐:[后缀自动机初探],题目都来自BZOJ. [Right集合] 后缀自动机真正优于后 ...
- 20155234 2016-2017-2 《Java程序设计》第6周学习总结
20155234 2016-2017-2 <Java程序设计>第6周学习总结 教材学习内容总结 Java将输入/输出抽象化为串流,数据有来源及目的地,衔接两者的是串流对象. 从应用程序角度 ...
- 【译】第九篇 Replication:复制监视器
本篇文章是SQL Server Replication系列的第九篇,详细内容请参考原文. 复制监视器允许你查看复制配置组件的健康状况.这一篇假设你遵循前八篇,并且你已经有一个合并发布和事务发布.启动复 ...