Question

这道CSS试题怎么做啊？

Answer 1

直观地看应该选D，
稍微解释一下，border是边框的宽度，inbox在outbox里面，图片在inbox里面，所以图片到最外层外边缘的距离应该先加上这两个边框的宽度：10+20 = 30；
同时，在inbox里，还有margin，表示页边距，也就是说在页面的每个边都留出这么多的空白，因此距离得再加上margin的值10：30+10 = 40；
再有，padding表示的是填充，这里，我们把它默认为是内填充，也就是可以想象成多填充一次margin，因此也要加上：40+10 = 50。
因此最终答案是50，选D。

但是这道题出的不严密，因为对于不同版本的浏览器，对于padding，border等的定义是不同的，比如有个叫“box-sizing”的属性，若定义成“box-sizing: content-box”，和定义成“box-sizing: border-box"时浏览器对padding和border等的解析不同，而不同的浏览器默认采取的解析方法不同。