今天在less里面用到了CSS3的calc()函数，很久不用，先是把运算符前后的空格给漏掉了，还好我及时发现。然后编译结束的运行，UI竟然说界面展示不对，我仔细一瞅，好像真有些不对劲。 知道的还是太少啊，那就重新再看看calc()函数好了。看得多了以后遇到问题也不慌，即使没看出…

像上面这种评星是一种很常见的需求，我原来是借助JS实现的，没有遇到多大的挑战。 后来张老师在code review我这段代码的时候，顺便提了一嘴type="range"应该可以实现，当时的我想破脑袋也想不出来，脑子是蒙的。 后来我根据文彬的建议，继续优化我的代码，我很开心的和他…

觉得它的风格很独特，尤其是其中一些边框。 嘿嘿，所以来一篇边框特辑，看看运用 CSS，可以在边框上整些什么花样。 谈到边框，首先会想到 border，我们最常用的莫过于 solid，dashed，上图中便出现了 dashed。 除了最常见的 solid，dashed，CSS b…

在2020年岁末有幸和一群优秀大学生在一起聊CSS相关的话题，感到非常的荣幸！在此非常感谢平台（阿里巴巴集团.前端练习生计划）给我这样的机会，同时也要非常感谢好友 裕波，墨苒对我的鼓励和支持。在结束直播的时候，说过后面要整理一篇文字版本，由于个人新转团队（互动团队转到 F(x)…

随着 Facebook 和 Twitter 最近的产品部署，我认为一个新的趋势正在缓慢增长:Atomic CSS-in-JS。 在这篇文章中，我们将看到什么是Atomic CSS（原子 CSS），它如何与 Tailwind CSS 这种实用工具优先的样式库联系起来，目前很多大公…

用户喜欢快速的网络应用，他们希望页面加载速度快，功能流畅。如果在滚动时有破损的动画或滞后，用户很有可能会离开你的网站。作为一名开发者，你可以做很多事情来改善用户体验。本文将重点介绍4个可以用来提高页面渲染速度的CSS技巧。 1. Content-visibility 一般来说，…

最近开源了一个 Vue 组件，还不够完善，欢迎大家来一起完善它，也希望大家能给个 star 支持一下，谢谢各位了。 经常有人私信我，小智这个设计图用 CSS 要怎么布局呀，这个按钮要怎么画的。所以今天，在这篇文章我们来介绍一些新的布局的方法，希望对智米们有些用处。 我通常做的第…