CSS核心:再说框模型(Box Model)

框模型(Box model,也译作“盒模型”)是CSS非常重要的概念,也是比较抽象的概念。

文档树中的元素都产生矩形的框(Box),这些框影响了元素内容之间的距离、元素内容的位置、背景图片的位置等等。而浏览器根据视觉格式化模型(Visual formatting model)来将这些框布局成访问者看到的样子。

因此,要掌握使用CSS布局的技巧,就需要深入了解框模型和视觉格式化模型的原理。
…阅读全文…

CSS核心:框模型与视觉格式化模型[2010年7月16日更新:包含块]

视觉类型的媒体根据CSS的视觉格式化模型(Visual formatting model)的规则来处理文档树中的元素,从而将(X)HTML转化成制作者设计的样子。

…阅读全文…

盒模型(BOX Model)

如果想熟练掌握DIV和CSS的布局方法,首先要对盒模型有足够的了解。每个HTML元素都可以看作一个装了东西的盒子,盒子里面的内容到盒子的边框之间的距离即填充(padding),盒子本身有边框(border),而盒子边框外和其他盒子之间,还有边界(margin),如图1所示。

…阅读全文…