在Dreamweaver中設(shè)計(jì)表單比較方便,下面通過一個(gè)示例的操作過程演示如何快速設(shè)計(jì)一個(gè)表單頁面。
【操作步驟】
第1步,打開本節(jié)模板頁面(orig.html),保存為index.php。在這個(gè)示例中,將設(shè)計(jì)一個(gè)完整的表單結(jié)構(gòu),最終預(yù)覽效果如下圖所示。
第2步,把光標(biāo)置于插入表單的具體位置,這里為<div data-role="content">標(biāo)簽中。然后選擇【插入】|【表單】|【表單】命令,在當(dāng)前光標(biāo)位置插入一個(gè)表單框。插入表單框之后,在設(shè)計(jì)視圖中會(huì)顯示紅色虛線框,如下圖所示。
第3步,把光標(biāo)置于表單框內(nèi),選擇【插入】|【表單】子菜單中的任意一個(gè)表單項(xiàng),如【文本】菜單選項(xiàng),在表單框內(nèi)的當(dāng)前光標(biāo)位置插入一個(gè)表單對(duì)象。提示:如果插入的文本框不位于表單框<form>標(biāo)簽內(nèi),則Dreamweaver會(huì)彈出提示對(duì)話框提示是否增加表單標(biāo)簽。
第4步,在頁面中插入一個(gè)文本表單對(duì)象之后,選中該表單項(xiàng),在【屬性】面板中設(shè)置表單對(duì)象的屬性,如下圖所示,該面板顯示文本框的全部屬性,可以進(jìn)行快速設(shè)置。
第5步,以同樣的方式,繼續(xù)插入其他表單對(duì)象,然后在【屬性】面板中設(shè)置屬性即可。