說明如何替延伸圓角框加上背景圖不同的標題。以及如何設定圓角框內項目清單的版面位置調整與滑鼠移入效果。

dreamweaver教學_圓垂直延伸圓角框（二） from joyhsu on Vimeo.

說明如何設定可垂直延伸的圓角框區塊。

dreamweaver教學_垂直延伸圓角框 from joyhsu on Vimeo.

示範如何設定有像相片框與漸層陰影的商品列表，並說明如何替商品加上「最新」「最熱門」的標籤貼紙。

dreamweaver教學_商品列表（相片框陰影背景） from joyhsu on Vimeo.

以同樣的html結構，不同的css設定做出圓角矩形背景的商品列表。

dreamweaver教學_商品列表（圓角矩形背景） from joyhsu on Vimeo.

示範如何建立商品列表的html結構，以及利用css設定商品排排站的樣式。

dreamweaver教學_商品列表 from joyhsu on Vimeo.

示範如何使用ul、li結構製作圓角標籤，以及設定滑鼠移過變換背景圖與文字顏色的效果。

dreamweaver教學_標籤（背景圖） from joyhsu on Vimeo.

示範如何使用ul、li搭配css製作有背景色、框線的標籤樣式，以及示範如何設定滑鼠移過變換底色與框線顏色的CSS樣式。

dreamweaver教學_標籤樣式 from joyhsu on Vimeo.