写CSS全给选择器加!important，项目大了改个按钮颜色翻了半小时才找到生效的

刚学前端改主题样式那会，我只要写的样式不生效，就下意识在后面加!important，觉得加了这个就肯定能盖过默认样式。一开始改个页面，加个五六处!important，效果立竿见影，我还觉得这招真好用。结果等项目写到几百个CSS选择器，我要改一个按钮的背景色，发现页面里写了快十个按钮样式，每个都加了!important，我改了半天，页面上按钮颜色根本不变，翻了半天才找到一个写在最后面的!important选择器在生效，白折腾了半小时。 那时候我整个项目的CSS文件里，密密麻麻全是!important，自己都记不住哪个样式是管哪个元素的，改完一个样式怕影响别的地方，得反复打开页面看十遍。有次合作的朋友帮我改页面，打开CSS文件直接头大，说你这文件里的样式全靠!important压，根本没人敢动，动一个就串一堆。后来我咬咬牙，把整个CSS文件重写了一遍，把所有多余的!important全删了，按CSS优先级规则来写：id选择器权重最高，然后是类选择器，最后是标签选择器，默认样式写在前面，自定义覆盖写在后面，一层一层按顺序来，再也不乱加!important了。 改完之后我才发现，其实根本不用加这么多!important，你把样式写对顺序，权重比默认样式高，自然就生效了，加!important只是图一时省事，后面维护的代价极大。就像盖房子，你一开始图快把承重墙砸了，后面全靠钢筋撑着，等要改个窗户，根本不知道哪根钢筋是承重的，拆错整个房子就塌了。 现在我写CSS，除非是真的需要强制覆盖第三方库的样式，否则绝对不写!important，哪怕是改个小细节，也老老实实按优先级写选择器。写出来的样式文件三个月之后再回来改，一眼就知道哪个样式管哪个元素，再也不用翻半天找生效的规则。新手刚学CSS的时候，最容易养成动不动就加!important的坏毛病，觉得这是解决问题的捷径，其实这是在给自己后面挖大坑，等项目一大，整个样式文件全成了谁都不敢碰的地雷。