做catalog的免费网站,网站开发一般采用什么框架,网站建设分析图,哪些网站做的好看按惯例#xff0c;上GIF#xff1a;重现#xff1a;https://codepen.io/anon/pen/JJBxOm
这是我今天参加面试时候#xff0c;面试官让我做的一道题#xff0c;面试官坐我旁边看我现场做#xff0c;然而我比较菜#xff0c;回来后才做出来……
来看看HTML部分#xff1a…按惯例上GIF重现https://codepen.io/anon/pen/JJBxOm
这是我今天参加面试时候面试官让我做的一道题面试官坐我旁边看我现场做然而我比较菜回来后才做出来……
来看看HTML部分由于li是inline-block元素所有没有写li的闭合写了的话每个li之间会有4px的间距不写浏览器也会自动补全。
CSS部分body {text-align: center;}ul {background: gray;width: 100%;padding: 20px;-webkit-perspective: 200;}li {list-style: none;height: 50px;width: 100px;padding: 0;margin: 0;display: inline-block;background: white;border-radius: 2px;}.anim {animation: anim 1s infinite;width: 100px;margin-left: -100px;background: white}keyframes anim {to {transform: rotateY(-360deg);}}.anim2 {animation: anim2 1s infinite;width: 100px;margin-left: -100px;background: white}keyframes anim2 {25% {transform: rotateY(0deg);}to {transform: rotateY(-360deg);}}这个动画效果的实现主要靠是perspective rotateY的应用我面试时写了rotateY但是不知道perspective所以做了很久没做出立体效果来后来面试官提示了我这个属性我回来后才做了出来。对于这公司出的这面试题其实我觉得挺坑的我觉得只有做过这动画的人才能当场做出来。
还有一道js题光描述就贼复杂就不放出来了今天的面试应该是挂了哈哈。
最后深圳南山求职呀~更多专业前端知识请上
【猿2048】www.mk2048.com
