css实现立方体转动动画
最近项目中一些可视化内容需要做一些动画，有一个立方体的转动效果，最开始想着是拿一个3D模型放上去，但是看了看别人的实现方式，发现自己想太多。
灵活运用css的transform属性，实现一个立方体是很容易的。
阅读更多
在项目中碰到一个数据可视化的业务，ui画了一些不规则的缺角矩形作为背景，但是又没有提供切图，本着求人不如求己的原则，就尝试拿CSS来画这种缺角的矩形及边框吧。
最近项目中一些可视化内容需要做一些动画，有一个立方体的转动效果，最开始想着是拿一个3D模型放上去，但是看了看别人的实现方式，发现自己想太多。
灵活运用css的transform属性，实现一个立方体是很容易的。
在项目中碰到一个数据可视化的业务，ui画了一些不规则的缺角矩形作为背景，但是又没有提供切图，本着求人不如求己的原则，就尝试拿CSS来画这种缺角的矩形及边框吧。
项目中遇到了一个需求是前台上传原图与对比图，后台进行对比分析，返回一个带有标注的识别结果，然后前台要实现原图与识别结果的卷帘对比效果。
我也不知道这个应该叫什么，感觉像个卷帘门一样，就姑且叫它卷帘效果了。
在学习arcgis的js api时，发现arcgis是有提供这种效果的小部件的，当然这次项目并没有使用arcgis，所以没法使用这个效果。后台问我这种效果好实现不，去找找插件试一下。回想到之前做过图片的截取效果，想着这个也可以用类似的方法实现的吧，所以就用同样的思想实现了这个效果，可能走了弯路，见谅哦。
height,max-height,min-height都是CSS中比较常用的属性，但关于他们的优先级却从没有认真考虑过。最开始考虑这个问题源于秋招时百度的一道笔试题，题目为问div的高度是多少？
1 | <style> |