阿超的博客

1 前言从这篇文章开始，我会记录、学习和研究面试中遇到的问题。当然，一般都是关于前端开发的。第一篇文章是讲盒子模型的。2 盒子模型的基本要素以下图中的button为例在chrome浏览器中查看这个元素，结果是这样的：蓝色部分（28 x 32 )是button的content，绿色的是padding，黄色的是border, 深黄色是margin。对的，盒子模型很简单，其实就这个4个概念。3 IE盒子

原文：Techniques for Clearing Floats如果你很清楚（浮动元素）的后继者元素是什么，那么你只需将clear：both应用于那个元素即可。这是一个理想的情况，因为这种方法无需花式的技巧以及额外的元素。当然，现实不会如此理想化（也就是说，你可能不知道后继者元素是什么），我们需要有更多的清除浮动的方法。 The Empty Div Method: 这个方法的意思就是字面意思：我们

1 前言这个可以说是前端面试的最为经典的问题。它不但考察知识面的广度，而且考察深度。而且它层次性，无论是大牛还是小白都能做出针对性的回答。Q&A: Q:网络上已经由这么多关于这个问题的博客，你为什么还要再写？ A:我的小学语文老师经常说：好记性不如烂笔头。我的学习经验证明：如果一个复杂的问题，你不去整理或者实践，那么你不能指望：看过答案之后就掌握怎么解决这个问题。另外：我对网络上关于这个问题的回

0 前言趁热打铁写第二篇 写给出HTML代码<div id="outer"> <div id="inner">Foo foo</div> </div>1 水平居中水平居中还是挺容易的#inner { width: 50%; margin: 0 auto; }width不一定设置50%，小于outer的宽度即可。我经常用这个。IE8+的话，可以这么写：#inner { displa

原文：Centering in CSS: A Complete Guide在CSS中居中是（开发者）抱怨CSS设计的代表问题之一。有人嘲笑说：这有什么困难的呢？我认为，难度不在于解决问题，而在于有如此多的不同解决方法。这些方法在不同的场景下有不同的用处。这让我们手足无措。让我用一个决策树来帮助我们选择合适的解决方案。水平居中（Horizontally）居中的对象是一个inline或者inline-*

原文链接：Efficiently Rendering CSS我承认，我不经常考虑下面这个问题：我们写的CSS如何才能有效率的，换而言之，如何才能让浏览器更快地渲染它。这的确是浏览器厂商应该考虑的问题：页面加载越快，人们更愿意使用它们的产品。Mozilla 有一篇关于CSS开发的最佳实践（译者注：原文链接已失效）。谷歌（尝试）改进（浏览器）让网页加载地更快。让我们来浏览它们阐述的主要观点，然后讨论这些

在VSCode中安装插件ESLint 在项目的根目录创建一个规则文件 新建.stylelintrc如下 { "extends": "stylelint-config-recommended" } 这是一个最简单的配置文件，你可以根据需求自行添加需求 安装相关的npm包 npm install --save-dev stylelint-config-recommended 重启...