CSS实现展开动画 展开收起效果是比较常见的一种交互方式，通常的做法是控制display属性值在none和其它值之间切换，虽说功能可以实现，但是效果略显生硬，所以会有这样的需求——希望元素展开收起能具有平滑的效果。 实现 max-height 首先想到的是通过height在0与auto之间 ...

　　刚刚进园，第一篇博客，记录一下CSS3 绘制盒子效果的方法。 　　css3允许使用 3D 转换来对元素进行格式化，转换是使元素改变形状、尺寸和位置的一种效果，3D转换可以通过设置transform的属性值来实现动画效果，其属性值有translate3d()移动,rotate3d()旋转 ...

<style type="text/css"> .arrow { display: block; width: 20px; height: 20px; position: absolute; bottom: 25px; left ...

代码： 图片资源 ...

直接上代码： OK！ ...

最近在做项目时，发现CSS3中关于动画的技术，自己很少运用在项目中，平时一些列表块的收缩和展开动画效果，几乎都是使用 display 的 none 和 block，或者 visibility 的 hidden 和 visible 来进行控制。因此，在最近的项目中，就开始深入研究CSS3关于动画 ...

demo地址 效果图 在别人网站上看到一个立体旋转的例子，然后突然想到自己前几天学习的css3旋转，就试着做了一个例子，看起来有一些粗糙。 html结构很简单： 核心是一个ul，li列表，其中6个li通过不同的属性设置分别构成立方体的6个面，然后外围ul沿Y轴旋转 ...

1、transform 该属性对元素进行旋转、缩放、移动和倾斜 translate元素从当前位置移动 rotate元素顺时针旋转 scale元素的尺寸增大或减小 skew元素翻转 2、transition 元素从一种样式逐渐变为另一种，该属性一般加载鼠标悬浮时的效果，鼠标移出时会逐渐 ...