當前位置:編程學習大全網 - 站長素材 - Dreamweaver CS6 制作壹個簡單網頁

Dreamweaver CS6 制作壹個簡單網頁

以實例說明Dreamwaver CS 6版本的應用。即使現在用很多有關DreamwaverCS6版本的書籍資料,但是資料太過復雜,反而不知道從而下手。這篇經驗將以本人經驗說說Dreamwaver CS6 的使用。這裏舉的例子是“新聞網頁首頁”的制作。

打開DW,DW界面如圖

分析所制作的網頁的需求,明確目標

明確需求。如果是建議壹個網站,需要建立壹個站點,方便管理並使制作步驟更為有條理。

新建站點彈出來的窗口。在這裏我輸入的是“新聞網頁”,放在Dreamwaver CS6文件夾下的新聞網頁文件夾

在新聞網頁文件夾下新建“images”文件,導入制作網頁所需要的素材,這裏所需要的素材都是圖片

新建HTML,選擇“創建”

在“標題”中輸入“新聞網頁首頁”,轉換到“設計”界面

根據制作網頁需求插入表格,只是在行列有所變化,下面的“表格寬度”以下選項根據圖設置

插入表格如圖,選擇表格,會看到表格邊框變紅,選擇之後變黑。在屬性中對齊選項選擇“居中對齊”

在表格第壹行第壹列輸入“用戶名”,在第壹行第二個表格插入“文件域”。然後是密碼,同樣的插入“文件域”。切換到“拆分”界面,選中密碼對應的“文件域”,將“type”改為“password”

插入圖像,不知道怎麽填的話就壹直選擇“確定”即可

插入按鈕,同上面插入圖像的處理方法那樣處理,如果不知道填什麽就壹直“確定”,無妨。在屬性欄裏的值改為“登錄”。然後插入圖像“谷歌logo”,附上效果圖

選中第二行,點擊鼠標右鍵,選擇“表格”,“合並單元格”

在第二行插入圖片。完成頁面制作。保存HTML文件。然後在站點“新聞網頁”可以看到保存的HTML文件

點擊制作好的HTML文件,選擇用360瀏覽器打開,輸入用戶名和密碼,然後會看到如下情況:用戶名課件,密碼不可見,符合實際

當然也可以在Dreamwaver CS6 的實時視圖中完成第15步

  • 上一篇:壹加壹作文素材
  • 下一篇:關於星際爭霸2裏的主宰
  • copyright 2024編程學習大全網