草叢的一小塊田地

為了自適應網頁設計(RWD，Responsive Web Design)，也有人翻譯為"響應式網頁"。研究好一陣子的"流變網格"，這是 Dreamweaver CS6 ( 以下簡稱為DW ) 開始才有的新功能。

它是由HTML5與CSS3組成，邏輯上來說，利用三組同名稱的 CSS 樣式(但是儲存在一個樣式表檔中)來控制一組DIV。最外圍的 DIV，由.gridContainer這個樣式控制，再藉由"媒體偵測"，也就是@media這個語法去偵測瀏覽器所在的裝置解析度。在 DW 中，設定為三種尺寸的解析度，480px以下、481~768px及769px以上。不過我認為這還有討論的空間。

重點是，在建立過程中，真的有些麻煩。最近在課程中帶著同學們一步一步建立，還好同學們都很小心翼翼，結果蠻成功的。因此，我想在接下來的文章，將整個過程一篇一篇寫出來，提供給對這方面有興趣的朋友參考。也會介紹一些國外相關的網站。說實在的，目前的粗淺心得是，如果DW使用這個技術來建立結構有些複雜的網站，應該會很辛苦。我也會試著用這種方式建立範本，過程中勢必發生錯誤，也請各位先進指正，先謝謝了！