一场由css代码里“{}”前的空格引起的风波

从毕业工作开始算起，我已经写了一年十个月的代码，写css代码从来没注意过“{}”前的空格，一般都是写完直接格式化源代码，从来没出过问题，可是今天却被这个空格给坑惨了。

我博客全栈分享的二级栏目增加了个“php+mysql”，如果继续延用一级栏目的16号字体大小，“php+mysql”这一栏会充满整个二级li，所以字体大小得改为14px，除此之外，我的二级栏目稍显复杂，二级ul并没有单独命名，只是用逻辑层级关系去写样式，这就牵扯到消除一级栏目样式对二级栏目的影响：

也就是只修改了二级li里面的a的字体大小和新增清除一级第五个li对二级第五个li的影响，但是出现了一个很诡异的现象，修改的都是同样的代码首页字体大小没生效但清除影响生效了，通用模板字体大小生效了但清除影响没生效，在百度云加速刷新了全站缓存、打开了实时同步也清除了浏览器缓存均无果，以为是百度云加速产品的问题，所以联系了百度商业安全客服，两个客服轮番沟通还打电话均没有解决问题，折腾了三个小时我选择去眯了一会，醒来继续看代码，鬼马神差地看到“a”和“{}”之间没有空格，于是敲了下空格，保存，没问题。

开始百度：

说空格的倒是一大堆，但没有我这个情况的。若真是空格的问题，那为什么我通用列表页模板的样式里没加空格就是“a”紧贴“{}”样式照样生效？但是，此次折腾确实因为该空格而起。

我把所有的css文件复制到本地用dw齐刷刷格式化源代码了一遍，上传之后完美解决问题。

截止发文，此问题无解。

总结一句话：用专业的代码编辑器，写规范的代码。像webstorm，敲“{}”的时候会自动在前面加上空格。