css3
三和小钢炮
2016 毕业于「双一流」;
2016-2018 上市公司担任前端兼JAVA开发;
2018-2021 世界500强担任前端核心开发;
2021-至今 某头部公司历练;
展开
-
css3实现高斯模糊
css高斯模糊 1. 直接模糊 效果如下图: 代码: 模糊前: <div id="bg0"></div> 模糊后: <div id="bg"></div> <style type="text/css"> #bg0, #bg { width: 660px; height: 100px; background: url(1.png); } #bg { filter: blur(20px); } &l原创 2020-07-15 20:49:21 · 9755 阅读 · 4 评论 -
css3简单进度条
下面代码实现一个极为简单进度条: &lt;style type="text/css"&gt; .progress-wrap { border: solid 1px #333; } .bar { background: #60c0e0; height: 30px; } .progress { animation: progress 5s; } @keyframes pr...原创 2018-11-25 21:59:23 · 2609 阅读 · 0 评论 -
一分钟学习flex布局
flex布局 本文写给想在一分钟内运用flex的同学们,要详细学习的同学请参看阮一峰老师的文章: http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html (一)应用范围 flex布局有兼容性问题,目前用在h5移动端。 (二) 快速上手 例如:小盒子在大盒子居中问题。 &amp;lt;style type=&quot;text/css&quot;&amp;gt; .out...原创 2018-11-25 23:04:04 · 171 阅读 · 0 评论 -
css如何实现10px字体
谷歌的字体最小限制是12px,当然这是为了保护视力。 不过很多UI是不考虑保护视力的。 我们这样实现: .text { /* font-size: 10px; */ transform: scale(0.83); } ...原创 2018-12-21 16:34:46 · 13392 阅读 · 0 评论