[{"data":1,"prerenderedAt":229},["ShallowReactive",2],{"article-css中不要在顶层使用*选择器":3},{"title":4,"article":5,"hot_article":15,"month_arch":78,"cover":226},"css中不要在顶层使用*选择器 - 独孤影的博客",{"id":6,"title":7,"uri":7,"author":8,"tags":9,"created_at":12,"view_count":13,"content":14},25,"css中不要在顶层使用*选择器","duguying",[10,11],"css","选择器","2014-12-16 00:53:56",3538,"\u003Cp>今天遇到了一个比较坑的问题，使用Ace Editor却发现代码显示区与编辑器错位，表现是这样的，编辑器中一行代码结束了，但是移动光标却发现后面还有空白位，一开始我以为是空格之类的东西，于是删除最后一个空白位，然后最后一个字符就消失了，继续删字符继续消失，很明显是编辑区与显示区错位。\u003C\u002Fp>\u003Cp>于是我怀疑是前面的css代码对此处的样式产生了影响，scss已经写了不少了，想直接查找是什么地方产生的影响是比较麻烦的，代码删减法，最后发现是全局样式文件中的一段代码导致的\u003C\u002Fp>\u003Cpre class=\"brush:css;toolbar:false\">*{\n\tfont-family:&nbsp;$main-font-family;\n\tmargin:&nbsp;0;\n\tpadding:&nbsp;0;\n}\u003C\u002Fpre>\u003Cp>其实之前对编辑器区域的审查元素发现编辑器几乎完全是由div元素构成，\u003Ccode>*\u003C\u002Fcode>表示匹配所有的元素，自然也包括了div元素，早就记不清是从哪儿学的这种写法，事实上这样写的目的是清除所有元素的默认margin和padding，开始的时候是觉得这么写也是无可厚非的，简洁有力，可是没想到有一些插件居然是基于浏览器默认的元素margin和padding来设计布局的，我在一开始的时候就将所有元素的margin及padding清零自然会影响到这些插件的样式。其实在用Ace Editor之前我用的是CodeMirror编辑器，但是CodeMirror却不受影响，估计是它指定了自己的margin和padding值，不受默认值影响。\u003C\u002Fp>\u003Cp>现在越来越觉得使用\u003Ccode>*\u003C\u002Fcode>选择器是一件不靠谱的事情，\u003Ccode>*\u003C\u002Fcode>（通配符）的通用性太大了，匹配所有，是所有的元素。因此*使用的位置越靠顶层对全局的影响越是大，导致后期的故障或者冲突的可能性越大，尽管使用\u003Ccode>*\u003C\u002Fcode>选择器可能会节省一些代码，但是与导致的冲突相比是得不偿失的。\u003Ccode>*\u003C\u002Fcode>不能乱用，用在底层还好\u003C\u002Fp>\u003Cpre class=\"brush:css;toolbar:false\">.footer&nbsp;.footer-wraper&nbsp;.right&nbsp;.right-tag,&nbsp;.footer&nbsp;.footer-wraper&nbsp;.right&nbsp;*&nbsp;{\n&nbsp;&nbsp;...\n}\u003C\u002Fpre>\u003Cp>一般不要随意使用*，如果要使用*，建议在\u003Ccode>*\u003C\u002Fcode>下面不要再存在子元素，后或者下面的子元素不是很深并且样式在自己的控制之内。\u003Cbr\u002F>\u003C\u002Fp>",{"title":16,"list":17},"最热文章",[18,24,30,36,42,48,54,60,66,72],{"id":19,"title":20,"uri":21,"author":8,"created_at":22,"view_count":23},28,"docker容器目录与主机目录同步","\u002Farticle\u002Fdocker容器目录与主机目录同步","2014-12-31 12:34:08",15570,{"id":25,"title":26,"uri":27,"author":8,"created_at":28,"view_count":29},21,"beego中使用fis","\u002Farticle\u002Fbeego中使用fis","2014-12-03 10:47:56",9250,{"id":31,"title":32,"uri":33,"author":8,"created_at":34,"view_count":35},20,"用github登录，oauth开发","\u002Farticle\u002F用github登录，oauth开发","2014-11-23 13:33:37",9113,{"id":37,"title":38,"uri":39,"author":8,"created_at":40,"view_count":41},18,"windows服务注册工具nssm","\u002Farticle\u002Fwindows服务注册工具nssm","2014-10-31 21:34:39",9047,{"id":43,"title":44,"uri":45,"author":8,"created_at":46,"view_count":47},49,"用latex排版中文书籍","\u002Farticle\u002F用latex排版中文书籍","2016-10-31 11:12:02",8634,{"id":49,"title":50,"uri":51,"author":8,"created_at":52,"view_count":53},19,"texlive中文书签乱码","\u002Farticle\u002Ftexlive中文书签乱码","2014-11-15 02:54:01",8461,{"id":55,"title":56,"uri":57,"author":8,"created_at":58,"view_count":59},6,"Windows上的软件包管理器chocolatey","\u002Farticle\u002FWindows上的软件包管理器chocolatey","2014-08-10 15:55:22",8009,{"id":61,"title":62,"uri":63,"author":8,"created_at":64,"view_count":65},3,"利用开源和免费资源搭建CI环境","\u002Farticle\u002F利用开源和免费资源搭建CI环境","2014-07-04 16:54:58",7732,{"id":67,"title":68,"uri":69,"author":8,"created_at":70,"view_count":71},16,"php-fpm网站目录权限配置","\u002Farticle\u002Fphp-fpm网站目录权限配置","2014-10-18 01:36:10",7274,{"id":73,"title":74,"uri":75,"author":8,"created_at":76,"view_count":77},27,"sublime text 2插件开发，外部修改文件无法重新加载","\u002Farticle\u002Fsublime text 2插件开发，外部修改文件无法重新加载","2014-12-26 20:24:13",7054,{"title":79,"list":80},"按月归档",[81,85,88,91,94,97,100,104,108,111,114,117,121,124,127,131,134,137,140,144,147,150,153,156,159,162,165,168,171,174,177,180,183,186,189,192,195,198,201,204,208,211,214,217,220,223],{"title":82,"uri":83,"view_count":84},"2026年7月","\u002Farchive\u002F2026\u002F7\u002F1","[1]",{"title":86,"uri":87,"view_count":84},"2026年1月","\u002Farchive\u002F2026\u002F1\u002F1",{"title":89,"uri":90,"view_count":84},"2025年4月","\u002Farchive\u002F2025\u002F4\u002F1",{"title":92,"uri":93,"view_count":84},"2024年6月","\u002Farchive\u002F2024\u002F6\u002F1",{"title":95,"uri":96,"view_count":84},"2024年5月","\u002Farchive\u002F2024\u002F5\u002F1",{"title":98,"uri":99,"view_count":84},"2024年4月","\u002Farchive\u002F2024\u002F4\u002F1",{"title":101,"uri":102,"view_count":103},"2023年12月","\u002Farchive\u002F2023\u002F12\u002F1","[6]",{"title":105,"uri":106,"view_count":107},"2023年11月","\u002Farchive\u002F2023\u002F11\u002F1","[2]",{"title":109,"uri":110,"view_count":84},"2023年10月","\u002Farchive\u002F2023\u002F10\u002F1",{"title":112,"uri":113,"view_count":84},"2023年7月","\u002Farchive\u002F2023\u002F7\u002F1",{"title":115,"uri":116,"view_count":107},"2023年6月","\u002Farchive\u002F2023\u002F6\u002F1",{"title":118,"uri":119,"view_count":120},"2023年5月","\u002Farchive\u002F2023\u002F5\u002F1","[3]",{"title":122,"uri":123,"view_count":107},"2023年4月","\u002Farchive\u002F2023\u002F4\u002F1",{"title":125,"uri":126,"view_count":107},"2023年3月","\u002Farchive\u002F2023\u002F3\u002F1",{"title":128,"uri":129,"view_count":130},"2023年2月","\u002Farchive\u002F2023\u002F2\u002F1","[5]",{"title":132,"uri":133,"view_count":84},"2023年1月","\u002Farchive\u002F2023\u002F1\u002F1",{"title":135,"uri":136,"view_count":107},"2022年12月","\u002Farchive\u002F2022\u002F12\u002F1",{"title":138,"uri":139,"view_count":130},"2022年11月","\u002Farchive\u002F2022\u002F11\u002F1",{"title":141,"uri":142,"view_count":143},"2022年10月","\u002Farchive\u002F2022\u002F10\u002F1","[4]",{"title":145,"uri":146,"view_count":103},"2022年9月","\u002Farchive\u002F2022\u002F9\u002F1",{"title":148,"uri":149,"view_count":130},"2022年8月","\u002Farchive\u002F2022\u002F8\u002F1",{"title":151,"uri":152,"view_count":84},"2019年7月","\u002Farchive\u002F2019\u002F7\u002F1",{"title":154,"uri":155,"view_count":84},"2019年2月","\u002Farchive\u002F2019\u002F2\u002F1",{"title":157,"uri":158,"view_count":84},"2018年9月","\u002Farchive\u002F2018\u002F9\u002F1",{"title":160,"uri":161,"view_count":84},"2018年8月","\u002Farchive\u002F2018\u002F8\u002F1",{"title":163,"uri":164,"view_count":84},"2017年11月","\u002Farchive\u002F2017\u002F11\u002F1",{"title":166,"uri":167,"view_count":84},"2017年8月","\u002Farchive\u002F2017\u002F8\u002F1",{"title":169,"uri":170,"view_count":84},"2017年5月","\u002Farchive\u002F2017\u002F5\u002F1",{"title":172,"uri":173,"view_count":84},"2017年4月","\u002Farchive\u002F2017\u002F4\u002F1",{"title":175,"uri":176,"view_count":84},"2016年11月","\u002Farchive\u002F2016\u002F11\u002F1",{"title":178,"uri":179,"view_count":84},"2016年10月","\u002Farchive\u002F2016\u002F10\u002F1",{"title":181,"uri":182,"view_count":107},"2016年9月","\u002Farchive\u002F2016\u002F9\u002F1",{"title":184,"uri":185,"view_count":84},"2016年8月","\u002Farchive\u002F2016\u002F8\u002F1",{"title":187,"uri":188,"view_count":107},"2016年7月","\u002Farchive\u002F2016\u002F7\u002F1",{"title":190,"uri":191,"view_count":130},"2016年6月","\u002Farchive\u002F2016\u002F6\u002F1",{"title":193,"uri":194,"view_count":84},"2015年12月","\u002Farchive\u002F2015\u002F12\u002F1",{"title":196,"uri":197,"view_count":84},"2015年10月","\u002Farchive\u002F2015\u002F10\u002F1",{"title":199,"uri":200,"view_count":107},"2015年2月","\u002Farchive\u002F2015\u002F2\u002F1",{"title":202,"uri":203,"view_count":84},"2015年1月","\u002Farchive\u002F2015\u002F1\u002F1",{"title":205,"uri":206,"view_count":207},"2014年12月","\u002Farchive\u002F2014\u002F12\u002F1","[8]",{"title":209,"uri":210,"view_count":107},"2014年11月","\u002Farchive\u002F2014\u002F11\u002F1",{"title":212,"uri":213,"view_count":130},"2014年10月","\u002Farchive\u002F2014\u002F10\u002F1",{"title":215,"uri":216,"view_count":120},"2014年9月","\u002Farchive\u002F2014\u002F9\u002F1",{"title":218,"uri":219,"view_count":120},"2014年8月","\u002Farchive\u002F2014\u002F8\u002F1",{"title":221,"uri":222,"view_count":120},"2014年7月","\u002Farchive\u002F2014\u002F7\u002F1",{"title":224,"uri":225,"view_count":107},"2013年9月","\u002Farchive\u002F2013\u002F9\u002F1",{"url":227,"title":228},"https:\u002F\u002Fimage.duguying.net\u002F2022\u002F09\u002Fij6x8o4s.webp","老家 摄于2020年秋",1790062269056]