web前端的開發，ui是很重要的，乙個成功的ui往往就是專案成功的一半。
在商業化的ui裡面，布局是乙個很重要的設計要素。
一、整體布局
1. frameset布局
frameset是使用得最廣泛的布局模式。
優點1. 簡單
frameset的布局是瀏覽器一級的介面，我們不用關心但頁面溢位時，我們應該怎麼處理，而且標籤和屬性不多
2.巢狀頁面時，執行效率好。
如果我們不使用frameset來巢狀頁面，當然我們也可以選擇iframe。但是iframe的執行效率並不高，而且很容易記憶體溢位。
缺點1.不靈活，我們無法自由的定製漂亮的自定義邊框，只能使用有限的border屬性值去控制邊框。而且一旦我們寫定了頁面的框架後，我們就無法更改。
2.有些瀏覽器並不支援frameset
2. div布局
div布局是一種很靈活的布局形式，但如果經常情況下，我們都會在布局中增加巢狀頁面，這時我們必須使用iframe。但div的布局非常的靈活。
有興趣的朋友可以研究乙個ext 的viewport元件，這個元件就是用div實現頁面布局的乙個優秀範例，當然viewport雖然介面美觀，但速度卻有待提高。
二、定位
1. 絕對定位
絕對定位是乙個很好理解的元素定位方法。絕對定位不會在乎頁面上其他元素的干擾，而是相對於視窗的左上角的定位模式，就相似於數學中的座標。html中，我們可以在style中定義position屬性的值為absolute。同時我們還要設定left和top屬性。
pc全屏網頁布局小技巧
今天又寫了乙個全屏網頁，其實之前也寫了很多次，一直都沒有總結，今天在這裡總結出來的小技巧記錄一下。pc的設計圖一般都1920的，但是還有很多小屏，比如自己的筆記本就是1366，如果說完全按照設計圖的尺寸布局，那放在小螢幕上瀏覽時總會有一些地方不協調，字型過大，過大，間距過大。下面就以今天的網頁為例解...
網頁布局流式布局
工具所用到外掛程式 masonry 是 一款非常強大的jquery動態網格布局外掛程式，可以幫助開發人員快速開發類似剪貼畫的介面效果。和css中float的效果不太一樣的地方在 於，float先水平排列，然後再垂直排列，使用masonry則垂直排列元素，然後將下乙個元素放置到網格中的下乙個開發區域。...
網頁布局 table布局
table 的特性決定了它非常適合用來做布局，並且 中的內容可以自動居中，這是之前用的特別多的一種布局方式 而且也加入了display table dispaly table cell來支援 teble 布局。1.簡單布局 1 doctype html 2 html lang en 3 head 4...