1. 潮流
css的书写与代码管理，一直是前端er的心头大患。
近些年开始火起来的，国外各个大厂都在采用的原子类的css书写方式正在逐步流行起来。以此类框架最流行的tailwindcss为例，不用写class，不用写style，直接写原子类，画风是下面这样的：
原子类写起来是爽，还有代码提示，但是看起来，一长串class类名，很多前端er心里真是发毛啊。一句话：写起来爽，用起来香，但看起来是真的丑！不能忍的那种丑。。。
因此，有些tailwind的酷爱者，只能被迫忍受这样的一大串classname，有的干脆忍痛放弃tailwind，回到原来的自定义class的模式。
2. 探索
我之前想过，有没有一个办法，能在vscode中将这一长串class隐藏起来呢，想实现的原型是这样的：
将classname 藏在css标识里面，hover这个标识，弹出编辑框，编辑css。 idea挺nice的，自己都忍不住觉得自己是个人才。。。然鹅，利用两个周末，查阅好几遍vscode官网文档，不知道如何实现这样一个插件，在社区请教大佬，也是杳无音讯。。。心想，算了吧，忍忍吧，丑点就丑点吧，又不是不能用
3. 破解
不过最终我还是没有放弃，后来过了几天在插件市场搜索，找到了inline fold这款插件，幸亏英语还有两把小刷子，不然都找不到。哇！这就是我想要的插件啊，能将class行内折叠，虽然长得和我的原型不一致，但是，功能够用了，破解了css class name又臭又长的问题。向这个插件的作者致敬！！！
看了这个插件的介绍，原来人家本来就是为了解决tailwind css类名长的问题而生的，英雄所见略同啊~
4. 总结
如果说tailwind是屠龙刀，那inline fold就是倚天剑，屠龙倚天共同开启前端css开发的新纪元。 用了两大神器后，画风是这样的：
继承了tailwind香的内在，减弱了tailwind丑的外表，怎么样，小编的这种组合，不能不说是完美吧！
今将此等干货大法传授给各位江湖大侠，还望点赞评论转发以资鼓励，繁荣我大掘进社区~~~
