正文內(nèi)容

0301--靜態(tài)網(wǎng)頁(yè)制作(dreamweaver)-以“個(gè)人(編輯修改稿)

2026-05-13 08:22 本頁(yè)面

　

【文章內(nèi)容簡(jiǎn)介】添加下列樣式代碼對(duì)整個(gè)頁(yè)面的樣式進(jìn)行定義。body{ padding:0。 margin:0。 background:url(../images/)。 }(1) 接下來(lái)在樣式表中定義“top”的樣式，也就是定義頁(yè)眉的結(jié)構(gòu)，添加下列樣式代碼：top,nav,main{ margin:0 auto。 /*將頁(yè)面中的三個(gè)大區(qū)塊設(shè)置水平居中*/ }banner{ width:600px。 height:133px。 }(2) 在“”中，在網(wǎng)頁(yè)的主題部分加入頁(yè)眉部分的圖片“”文件。代碼如下：div id=top img src=image//div(3) 頁(yè)面效果如圖3所示：圖3 “個(gè)人主頁(yè)”頁(yè)眉效果圖（四）工作任務(wù)四：制作“個(gè)人主頁(yè)”首頁(yè)導(dǎo)航條【任務(wù)要求】通過(guò)CSS規(guī)則來(lái)精確控制網(wǎng)站首頁(yè)導(dǎo)航欄部分，從而實(shí)現(xiàn)頁(yè)面布局效果。【任務(wù)分析】完成ID名稱(chēng)為nav的DIV區(qū)塊的CSS設(shè)置。核心思想是利用列表實(shí)現(xiàn)導(dǎo)航條內(nèi)容的添加，在通過(guò)css樣式實(shí)現(xiàn)布局的改變?！救蝿?wù)詳解】(1) 在名稱(chēng)為“nav”的DIV結(jié)構(gòu)中輸入以下代碼div id=nav ul lia href=首頁(yè)/a/li lia href=心情日記/a/li lia href=Free/a/li lia href=一起走到/a/li lia href=從明天起/a/li lia href=紙飛機(jī)/a/li lia href=下一站/a/li /ul/div(2) 首先切換到樣式表文件“”，添加下列樣式代碼對(duì)導(dǎo)航條的樣式進(jìn)行定義。nav{ width:600px。 height:22px。 backgroundcolor:90bcff。 margintop:15px。 textalign:center。 }nav ul{ liststyletype:none。 marginleft:15px。} nav li{ float:left。 width:76px。 textalign:center。 lineheight:22px。 }a:link{ color:00F。 textdecoration:none。}a:hover{ color:F00。 textdecoration:underline。}a:acktive{ color:000。 textdecoration:none。}a:visited { backgroundcolor: 000。}(4) 頁(yè)面效果如圖4所示：圖4 “個(gè)人主頁(yè)”導(dǎo)航條效果圖（五）工作任務(wù)五：制作“個(gè)人主頁(yè)”首頁(yè)主內(nèi)容區(qū)【任務(wù)要求】通過(guò)CSS規(guī)則來(lái)精確控制網(wǎng)站首頁(yè)主內(nèi)容區(qū)域，從而實(shí)現(xiàn)頁(yè)面布局效果。【任務(wù)分析】完成網(wǎng)站主內(nèi)容區(qū)域布局設(shè)計(jì)及內(nèi)容版式設(shè)計(jì)，此部分我們將完成ID名稱(chēng)為divMain的DIV區(qū)塊的CSS設(shè)置。【任務(wù)詳解】(1) 打開(kāi)“”文件，在樣式表中添在名稱(chēng)為“divMain”樣式，并對(duì)其樣式的具體設(shè)置。 divMain{ width:600px。 height:800px。 Background:red。 /*添加區(qū)塊測(cè)試顏色*/}(2) 頁(yè)面效果如圖5所示：圖5 “個(gè)人主頁(yè)”主內(nèi)容區(qū)效果圖(3) 添加主體內(nèi)容左區(qū)塊的頁(yè)面結(jié)構(gòu)，其代碼如下：div id=divLeft img src=images/ width=93 height=123 class=imgLeft / p class=leftTextTitle我的日記本/p p class=leftTextContent他們彼此深信，是瞬間迸發(fā)的熱情讓他們相遇。這樣的確定是美麗的，但變幻無(wú)常更為美麗。/p img src=images/ width=93 height=103

點(diǎn)擊復(fù)制文檔內(nèi)容

公司管理相關(guān)推薦

dreamweavercs4網(wǎng)頁(yè)設(shè)計(jì)與制作指南第16章-資料下載頁(yè)

【總結(jié)】第16章公司網(wǎng)站制作案例本章案例以制作一個(gè)電力公司的網(wǎng)站和主導(dǎo)，系統(tǒng)講解如何實(shí)現(xiàn)客戶(hù)的需求，在整個(gè)過(guò)程中，按照“新建站點(diǎn)”|“制作模板”|“制作首頁(yè)文件”|“制作子頁(yè)文件”|“案例擴(kuò)展分析”的流程，全面分析制作網(wǎng)站的過(guò)程。本章重要知識(shí)點(diǎn)：?了解企業(yè)網(wǎng)站的制作流程?掌握制作模板的流程?掌握新建和修改CSS樣式表的技巧?

2026-03-01 11:33

靜態(tài)網(wǎng)頁(yè)班級(jí)網(wǎng)站設(shè)計(jì)-資料下載頁(yè)

【總結(jié)】?jī)?nèi)蒙古化工職業(yè)學(xué)院畢業(yè)設(shè)計(jì)（論文）用紙第1頁(yè)班級(jí)網(wǎng)站設(shè)計(jì)畢業(yè)論文摘要班級(jí)網(wǎng)站是一個(gè)班級(jí)和外界交流的窗口，也是本班同學(xué)相互聯(lián)系,交流的平臺(tái)。本網(wǎng)站的主要功能是能讓各類(lèi)用戶(hù)在自己的權(quán)限范圍內(nèi)方便地管理相應(yīng)的信息網(wǎng)站在登錄界面提供身份驗(yàn)證功能，并且還

2025-11-25 00:41

dreamweaver網(wǎng)頁(yè)設(shè)計(jì)之：框架-資料下載頁(yè)

【總結(jié)】第7章框架在設(shè)計(jì)網(wǎng)頁(yè)頁(yè)面布局的時(shí)候，一般我們可以通過(guò)表格來(lái)進(jìn)行排版，但還有一類(lèi)網(wǎng)頁(yè)可以使用框架來(lái)設(shè)計(jì)。利用框架設(shè)計(jì)的頁(yè)面，可以將不同的信息內(nèi)容分類(lèi)顯示在不同的區(qū)域內(nèi)，那樣可以簡(jiǎn)化操作，使頁(yè)面布局合理，訪問(wèn)者瀏覽查看也更方便。?學(xué)習(xí)目標(biāo)理解框架和框架集的概念；掌握使用框架設(shè)計(jì)網(wǎng)頁(yè)的方法。

2026-03-01 02:01

dreamweaver網(wǎng)頁(yè)設(shè)計(jì)8-資料下載頁(yè)

【總結(jié)】第8章框架框架的基本概念創(chuàng)建框架集保存框架和框架集設(shè)置框架和框架集的屬性框架實(shí)例模板思考與練習(xí)1圖2框架的基本概念框架（Frame）就是瀏覽器窗口的一個(gè)區(qū)域，在這個(gè)區(qū)域中可以顯示一個(gè)單獨(dú)的文檔（頁(yè)面）而不影響另一個(gè)區(qū)域中的顯示內(nèi)容?？蚣苡掷斫鉃?/span>

2026-03-01 11:35

[理學(xué)]dreamweaver網(wǎng)頁(yè)設(shè)計(jì)說(shuō)課稿-資料下載頁(yè)

【總結(jié)】《網(wǎng)頁(yè)三劍客》FLASH動(dòng)畫(huà)制作篇（二）制作人夏賢鈴一堂課說(shuō)課稿進(jìn)入主頁(yè)上一頁(yè)下一頁(yè)※退出第9章動(dòng)態(tài)網(wǎng)頁(yè)制作?教材分析?教學(xué)目標(biāo)?教學(xué)重難點(diǎn)?教學(xué)方法?上課課件?教學(xué)課時(shí)?教學(xué)過(guò)程?課堂小結(jié)?實(shí)戰(zhàn)演練主頁(yè)

2025-10-10 00:34

dreamweaver網(wǎng)頁(yè)設(shè)計(jì)2-資料下載頁(yè)

【總結(jié)】第二講HTML語(yǔ)言HTML語(yǔ)言是超文本標(biāo)記語(yǔ)言（HypertextMark-upLanguage）的縮寫(xiě),主要用來(lái)創(chuàng)建與系統(tǒng)平臺(tái)無(wú)關(guān)的網(wǎng)頁(yè)文檔,它不是編程語(yǔ)言，而是一種描述性的標(biāo)記語(yǔ)言。所有網(wǎng)頁(yè)軟件都是以HTML為基礎(chǔ)，學(xué)會(huì)了它可以更方便靈活地控制網(wǎng)頁(yè)。特別是在動(dòng)態(tài)網(wǎng)頁(yè)的設(shè)計(jì)中，常常需要利用ASP、JSP、PHP等代碼來(lái)輸出網(wǎng)頁(yè)的部分HT

2026-03-01 11:32

dreamweaver網(wǎng)頁(yè)設(shè)計(jì)授課教案-資料下載頁(yè)

【總結(jié)】第一篇：Dreamweaver網(wǎng)頁(yè)設(shè)計(jì)+授課教案 Dreamweaver教案一(一課時(shí)) 教學(xué)目的：初步了解Dreamweaver的操作教學(xué)重點(diǎn)：Dreamweaver的界面教學(xué)難點(diǎn)：各個(gè)...

2025-10-08 20:38

靜態(tài)網(wǎng)頁(yè)實(shí)訓(xùn)報(bào)告-資料下載頁(yè)

【總結(jié)】第一篇：靜態(tài)網(wǎng)頁(yè)實(shí)訓(xùn)報(bào)告計(jì)算機(jī)軟件學(xué)院實(shí)訓(xùn)報(bào)告 ——Web靜態(tài)主題網(wǎng)站設(shè)計(jì) 姓名：夏前偉胡維國(guó)海繼昌陳佑宏學(xué)號(hào)：09 04 03 02專(zhuān)業(yè)：電子商務(wù)班級(jí)：電商1413時(shí)間：任課教師：...

2025-10-31 12:29

個(gè)人博客網(wǎng)頁(yè)設(shè)計(jì)與制作-資料下載頁(yè)

【總結(jié)】畢業(yè)設(shè)計(jì)（論文）--個(gè)人博客網(wǎng)頁(yè)設(shè)計(jì)與制作本科畢業(yè)論文題目：個(gè)人博客網(wǎng)頁(yè)設(shè)計(jì)與制作學(xué)院：信息科學(xué)與技術(shù)學(xué)院專(zhuān)業(yè)：軟件工程班

2025-11-28 00:40

網(wǎng)頁(yè)制作實(shí)訓(xùn)個(gè)人總結(jié)-資料下載頁(yè)

【總結(jié)】個(gè)人總結(jié)報(bào)告題目：網(wǎng)頁(yè)設(shè)計(jì)與制作專(zhuān)業(yè)班級(jí)：組長(zhǎng)：組員：指導(dǎo)教師：

2025-10-29 04:58

dreamweaver網(wǎng)頁(yè)設(shè)計(jì)第15章-資料下載頁(yè)

【總結(jié)】Dreamweaver網(wǎng)頁(yè)設(shè)計(jì)第15章站點(diǎn)管理【學(xué)習(xí)概述】利用Dreamweaver可以非常方便地創(chuàng)建和管理站點(diǎn)（創(chuàng)建站點(diǎn)詳見(jiàn)第3章），還可以對(duì)站點(diǎn)中的網(wǎng)頁(yè)和相關(guān)資源進(jìn)行管理。本章的重點(diǎn)內(nèi)容是檢查站點(diǎn)和上傳網(wǎng)頁(yè)。檢查和測(cè)試站點(diǎn)Dreamweaver提供了多項(xiàng)功能用來(lái)檢查和測(cè)試站點(diǎn)，其中包括預(yù)覽頁(yè)面和檢

2026-01-03 17:39

dreamweaver網(wǎng)頁(yè)設(shè)計(jì)-第15章-資料下載頁(yè)

2026-01-03 17:38

網(wǎng)頁(yè)制作與網(wǎng)頁(yè)設(shè)計(jì)-資料下載頁(yè)

【總結(jié)】開(kāi)封大學(xué)軟件學(xué)院07級(jí)應(yīng)用3、前言…………………………………………………………………………４二、網(wǎng)站建設(shè)前的準(zhǔn)備…………………………………………………………4(一)統(tǒng)一網(wǎng)站整體風(fēng)格中需準(zhǔn)備的內(nèi)容…………………………………..4(二)網(wǎng)站的定位和規(guī)劃………………………………………………………5(三)總體設(shè)計(jì)方案主題鮮明……………………………………………….

2026-01-04 17:32

網(wǎng)頁(yè)技術(shù)相關(guān)探討與靜態(tài)網(wǎng)頁(yè)設(shè)計(jì)畢業(yè)論文-資料下載頁(yè)

【總結(jié)】網(wǎng)頁(yè)技術(shù)相關(guān)探討與靜態(tài)網(wǎng)頁(yè)設(shè)計(jì)畢業(yè)論文1 緒論網(wǎng)頁(yè)(webpage)，是網(wǎng)站中的一頁(yè)，通常是HTML格式（）。網(wǎng)頁(yè)通常用圖像檔來(lái)提供圖畫(huà)。網(wǎng)頁(yè)要使用網(wǎng)頁(yè)瀏覽器來(lái)閱讀。(MMORPG游戲魔獸世界官方網(wǎng)站)網(wǎng)頁(yè)簡(jiǎn)介什么是網(wǎng)頁(yè)網(wǎng)頁(yè)是構(gòu)成網(wǎng)站的基本元素，是承載各種網(wǎng)站應(yīng)用的平臺(tái)。通俗的說(shuō)，您的網(wǎng)站就是由網(wǎng)頁(yè)組成的。如果您只有域名和虛擬主機(jī)而沒(méi)有制作任何網(wǎng)頁(yè)的話，您的客

2026-06-14 20:53

第2章使用dreamweaver制作個(gè)人網(wǎng)站-資料下載頁(yè)

【總結(jié)】第2章使用Dreamweaver制作個(gè)人網(wǎng)站?學(xué)習(xí)目標(biāo)：–1)了解Dreamweaver的工作界面，掌握創(chuàng)建及管理一個(gè)站點(diǎn)的方法。–2)掌握網(wǎng)頁(yè)文檔的創(chuàng)建、保存、關(guān)閉等基本操作。–3)掌握插入普通文本、特殊文本、圖像、表格等網(wǎng)頁(yè)基本元素的方法，能創(chuàng)建文本、圖像、錨點(diǎn)等超級(jí)鏈接。–4)理解CSS規(guī)則，能創(chuàng)建簡(jiǎn)單

2026-01-02 16:22