搜索文档
首页
HTML/CSS
JavaScript
服务端开发
Java教程
移动端
数据库
当前位置:
首页
HTML/CSS
CSS 参考手册
CSS 参考手册
源代码
清空
点击运行
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS line-height 属性动画示例- 基础教程(div.cn)</title> <style> .animated { padding: 10px; line-height: 20px; background: #e0cde0; border: 1px solid #a976a9; -webkit-animation: test 4s infinite; /* Chrome, Safari, Opera */ animation: test 4s infinite; } /* Chrome, Safari, Opera */ @-webkit-keyframes test { 50% {line-height: 60px;} } /* Standard syntax */ @keyframes test { 50% {line-height: 60px;} } </style> </head> <body> <P> <STRONG>警告：</STRONG> CSS动画不会在Internet Explorer 9和早期版本的工作</P> <P> <strong>注意：</STRONG>以下段落的行高属性从其初始值“20像素”到“60像素”动画，并返回到初始值“20像素”再次达到无限次。 <p> <div class="animated">Lorem存有胡萝卜，生态番茄汤。 对于足球电视的时间，而不是在各种悼念值得的。 Mauris很大，dapibus NEC turpis VEL的恐惧，它总是malesuada赌注。 不，不，没有交流的恐惧nisl坐阿梅德，巧克力饮料是纯净的。 Suspendisse VARIUS带箭头NIBH aliquet。 开发商临床胡萝卜元件制造。 活酵母在一些聚光灯下。 Quisque aliquam仇恨的栅极生态。 狮子在场玩家坐在饮足球，三重需要笑声。 整数aliquet华富UT ELIT他承认，有时，也没有创新。 完整穿过网络。</P> </body> </html>
运行结果
