你必须穷尽一生磨练技能,这就是成功的秘诀,也是让人家敬重的关键。

表现

移动端全兼容的flexbox速成班

移动端全兼容的flexbox速成班

练小习 3年前 (2016-06-17) 832浏览 1评论

说起flexbox,都算是件陈年旧事了,它是2009年W3C提出的一种全新的可伸缩的CSS布局方式。依赖flexbox,我们可以更简单,高效的完成可伸缩式页面的布局。 业界与flexbox的相关教程文章也是各式各样,新旧交替,很多小伙伴对flexbo...

带你轻松打开SVG动画的大门

带你轻松打开SVG动画的大门

练小习 3年前 (2016-06-07) 1339浏览 5评论

初学SVG的时候,感觉那一坨一坨的代码难读难懂,现在回过头仔细想想,是因为那时候看文档缺少一些具体的实例,导致学习起来很枯燥。如今SVG已经在前端各个领域都有所作为,无论是项目里的应用还是demo都所处可见,这里我就用一个实例的写法带新同学轻松的打开...

模拟微信支付宝密码输入框的效果

模拟微信支付宝密码输入框的效果

练习 3年前 (2015-12-10) 2964浏览 0评论

中午听到别人在讨论微信的支付框以及支付宝的支付框,于是自己写了个demo出来,原理很简单,通过隐藏input,使用label控制显示,实现起来很容易。唤起数字键盘采用了tel的type。 转载请注明:练小习的前端技术笔记 » 模拟微信支付...

绝对定位bottom值为0的位置问题

绝对定位bottom值为0的位置问题

练习 3年前 (2015-09-28) 3700浏览 4评论

有一个position值为absolute的div,他的祖先元素里没有任何定位属性,或者他的父元素就是body。 当这个div的bottom值为0的时候,他应该被定位到哪个位置? 这个大家都知道在最下面。 现在条件稍微修改一下,给body和html一...

今天写了个蛋疼的弧形轮播图,怎么说也是原创了

今天写了个蛋疼的弧形轮播图,怎么说也是原创了

练习 4年前 (2015-07-29) 2934浏览 2评论

看到一个弧形轮播图的设计稿,脑子里突然闪现出一个蛋疼的实现方式,轮播的脚本就不用说了,我的HTML结构,恩,就是这样的: 转载请注明:练小习的前端技术笔记 » 今天写了个蛋疼的弧形轮播图,怎么说也是原创了

css实现未知宽度的正方形需求

css实现未知宽度的正方形需求

练习 4年前 (2015-03-06) 4477浏览 3评论

今天群里有哥们问了一下,百分比宽度的正方形如何用css实现。其实就是不定宽的正方形如何用css实现。 第一个方法利用图片的等比例缩放,用base64写一个1*1的透明png图片,宽度100%,这样容器就自动被撑成一个正方形, 转载请注明:练小习的前端...

收集整理一些css3的图片阴影效果

收集整理一些css3的图片阴影效果

练习 4年前 (2015-03-04) 2523浏览 0评论

主要利用gradient,transform,配合after以及before伪元素来实现各种图片阴影,卷角效果。 转载请注明:练小习的前端技术笔记 » 收集整理一些css3的图片阴影效果

关于flex布局的目前兼容性写法

关于flex布局的目前兼容性写法

练习 4年前 (2015-02-03) 4897浏览 2评论

flex虽然使用起来很方便,但是他的兼容性由于历史版本的原因,一直很让人头疼,低版本IE就不用说了,webkit目前也不是所有版本都能支持同一写法,测试半天之后写了个差不多的写法,至少pc端高版本ie,chrome,firefox,opera,新版搜...