JackZhang的专栏

浮动布局是非常经典常见的页面布局方式。实现方式很简单，第一步先

浮动布局在固定屏幕（如UI面板，）是非常经典常见的页面布局方式。实现方式很简单，第一步先设置需要浮动起来的元素的宽度width。第二步设置该元素的浮动属性float

浮动布局在固定屏幕（如UI面板，人机交互界面）上是很常见的页面布局方式。实现方式很简单，将HTML端需要固定大小的内容包到中，并在CSS端设置该div的width即可第一步就是将HTML端需要固定大小的内容包到中，下图是将整个body包到中，以实现页面整体固定大小：

声明1：本篇内容大量参照W3C：http://www.w3.org/TR/CSS2/cascade.html声明2：英语里继承的单词应该是Inheritance，而Cascade意思是瀑布。文章标题【继承（Cascade）】并非不懂英语，而是本人理解之后认为Cascade等级是实现CSS元素属性继承的基础。元素属性继承规则：浏览器先判等级，等级高的优先。同等级的CSS再评分，分

绝对布局（Absolute Layout）就是指定元素的position属性为absloute，元素被指定为绝对定位后，浏览器会将其从流中删除。

现在由于手持设备，智能手机大行其道。同一页面很难应用到各种不同大小的设备中，针对不同设备特制页面开销又太大。解决方式是利用media属性智能识别各种设备，并应用不同的CSS式样。方案一：用HTML的元素中的media属性来区分设备：screen表示用于有屏幕的设备（这样就无法用于打印机，3D眼镜，盲文阅读机），max-device-width表示屏幕的最大宽度。因此

HTML的块元素和内联元素都有盒模型，区别是块元素的内外边距（margin和padding）可以自定义设置，但内联元素不可元素的盒模型图如下：外边距为margin，边框为border，内边距为padding因此元素总长度为margin-left + border-width + padding-left + content文本长度 + padding-right + border-

绝对布局（Absolute Layout）和冻结布局（Frozen Layout）间的就是凝胶布局（Jello Layout）