css3学习
文章平均质量分 51
仰望星空的包子
小小梦想大大世界~希望自己能一直快乐开心无忧无虑
展开
-
css3初体验之animation简单动画例子【来回滑动的小球】
Document div{width: 200px;height: 200px;border: 1px dashed green;} div span{ display:inline-block; width: 30px; height: 30px; border-radius: 100%; background-color: red; animat原创 2016-08-17 15:24:52 · 8321 阅读 · 0 评论 -
最近想学习下css3过渡效果,做了个简单例子,供大家参考
Document .one{ width: 200px; height: 200px; background-color: red; transition:width 2s,height 2s,border-radius 2s,transform 2s; -webkit-transition:width 2s,height 2s,border-radius 2原创 2016-08-17 15:07:32 · 414 阅读 · 0 评论 -
css3弹性盒子如何布局
【属性flex-direction:row,row-reverse,column,colmn-reverse】 Document .container{ display: -webkit-flex; display: flex; /*-webkit-flex-direction:row-reverse;*/【使用flex-direction属性,将能控原创 2016-08-25 15:11:57 · 410 阅读 · 0 评论 -
【css3初级】transition过渡效果写法,鼠标放到图片上图片变小
transition过渡效果可以应用到html每个元素。用法是添加到每个元素的事件中,比如说hover,onmouseover,onclick事件等。下面就给大家介绍下transition的简单用法: Document .animation{width: 200px;height: 200px;background-color: #ff0; --webkit-transition原创 2016-08-25 15:29:35 · 3183 阅读 · 0 评论 -
radio单选框效果代码(css3)
Document .radio-2{width:900px;margin:100px auto; background-color: #f0f;padding:10% 0%;text-align: center;} .radio-2 [type="radio"]{display: none;} .radio-2 label{display:inline-block;wi原创 2016-09-20 09:49:00 · 2902 阅读 · 0 评论 -
css3 2d skew()方法用法理解
skew()原创 2016-12-06 11:16:48 · 2141 阅读 · 0 评论 -
css3 3D特效
在学习css3的时候,发现最难得应该是这个3d特效啊,整了我好久都没搞清楚这其中的设置是如何弄得~是我想象力不行呢还是咋呢~接下来传上我写的代码,希望大家帮我分析分析为何要这样设置样式~ translateZ用法 *{margin:0;padding:0;} .light{margin-top: 200px;margin-left:200px;width:310px;he原创 2016-12-23 08:56:17 · 329 阅读 · 0 评论 -
css清除浮动方法大全
CSS清除浮动是每一位web前端工程师都要掌握的技术,也是让每一位刚入门的前端工程师感到头疼的问题,下面就来讲一下CSS清除浮动的原理和各种解决方法,大家可以根据实际情况选择最佳的解决方案。在用DIV+CSS布局时通常都会用到浮动(float)来完成页面布局,浮动(float)会使当前标签产生向上浮的效果,同时会影响到前后标签、父级标签的位置及转载 2017-03-06 14:47:47 · 380 阅读 · 0 评论