【正文】 顏色測(cè)試法是網(wǎng)頁布局中最常用的測(cè)試方法。l 此部分由于在課前已作為課前任務(wù)做好了前期的準(zhǔn)備工作，因此，直接在ps中實(shí)現(xiàn)效果圖的制作。 color:0FC。 } .leftTextContent{ textalign:left。 Background:red。} nav li{ float:left。 background:url(../images/)。【任務(wù)實(shí)施】在PS中設(shè)計(jì)“個(gè)人主頁”效果圖，具體實(shí)現(xiàn)過程不做詳解，如下圖1所示：圖1 頁面效果圖（二）工作任務(wù)二：分析“個(gè)人主頁”首頁整體結(jié)構(gòu)【任務(wù)背景】某學(xué)院計(jì)算機(jī)技術(shù)系要建立本系部網(wǎng)站，現(xiàn)已由網(wǎng)站策劃人員先期分析了網(wǎng)站的目的、功能定位及內(nèi)容規(guī)劃，并根據(jù)功能定位先行設(shè)計(jì)了網(wǎng)站效果圖。 掌握浮動(dòng)布局和定位技能目標(biāo)：178。學(xué)習(xí)評(píng)價(jià)?行為表現(xiàn) ○課堂作業(yè) ○測(cè)驗(yàn)測(cè)試 ?制作作品 ○其他 作業(yè)題目利用CSS+DIV自由設(shè)計(jì)并制作“個(gè)人首頁”要求：178。 教師首先簡(jiǎn)述本項(xiàng)目單元重點(diǎn)、難點(diǎn)，讓學(xué)生有重點(diǎn)的聽講。核心代碼如下：link href=css/ rel=stylesheet type=text/css(7) 首先根據(jù)分析得出的頁面結(jié)構(gòu)搭建整個(gè)網(wǎng)頁的頁面布局。nav{ width:600px。 textdecoration:none。 paddingleft:10px。re both convincedbr that a sudden passion joined them.br Such certainth is beautiful,br but uncertainty is more beautiful still./p br/div(7) 在“”樣式表中添在名稱為“divRight”樣式，并對(duì)其樣式的具體設(shè)置。l 認(rèn)真聽取教師的總結(jié)，明確本項(xiàng)目單元的學(xué)習(xí)任務(wù)。此部分符合樣式是為了對(duì)代碼進(jìn)行優(yōu)化，避免累贅，提高代碼的執(zhí)行效率。布置單元項(xiàng)目任務(wù)【約5分鐘】要求學(xué)生課下任務(wù)必須按質(zhì)按量按時(shí)完成，強(qiáng)調(diào)作業(yè)的重要性。在實(shí)際使用中，我們可以為這些需要居中的元素創(chuàng)建一個(gè)起容器作用的div。三、板書設(shè)計(jì)新課講解可擦寫區(qū)域l 設(shè)計(jì)網(wǎng)站效果圖l 劃分頁面區(qū)塊（重點(diǎn)）l 設(shè)計(jì)網(wǎng)站首頁頁眉（重點(diǎn)、難點(diǎn)）l 設(shè)計(jì)網(wǎng)站首頁導(dǎo)航條（重點(diǎn)、難點(diǎn)）l 設(shè)計(jì)網(wǎng)站首頁主題部分（重點(diǎn)、難點(diǎn)）講解細(xì)節(jié)布置任務(wù)四、課后附記課程回顧：【約10分鐘】l 通過互動(dòng)的方式回顧之前的學(xué)習(xí)內(nèi)容，為階段項(xiàng)目的制作做好準(zhǔn)備。br 六點(diǎn)零五分，br 我走進(jìn)地下鐵。 float:left。 textdecoration:underline。核心思想是利用列表實(shí)現(xiàn)導(dǎo)航條內(nèi)容的添加，在通過css樣式實(shí)現(xiàn)布局的改變。(5) 創(chuàng)建樣式表文件“”，將其保存在站點(diǎn)根目錄下的CSS文件夾中。（2）利用項(xiàng)目互動(dòng)提問回顧知識(shí)點(diǎn) l 網(wǎng)站設(shè)計(jì)流程？l 盒子模型的關(guān)鍵屬性？l 常用的定位方式有幾種？（3）互動(dòng)總結(jié)教師通過與學(xué)生互動(dòng)溝通，進(jìn)行知識(shí)的歸納：l 網(wǎng)站的設(shè)計(jì)流程包括需求分析、制作網(wǎng)頁效果圖、創(chuàng)建和設(shè)計(jì)網(wǎng)站、測(cè)試和發(fā)布等幾個(gè)環(huán)節(jié)；l 盒子模型的關(guān)鍵屬性包括content、border、padding和margin四個(gè)屬性。 通過CSS樣式修飾難點(diǎn)：178。 靈活運(yùn)用盒子模型靈活設(shè)計(jì)網(wǎng)頁布局178?！救蝿?wù)分析】效果圖導(dǎo)出之后，我們就可以使用這些素材在Dreamweaver著手進(jìn)行布局了，現(xiàn)在的布局技術(shù)包括表格布局和Web標(biāo)準(zhǔn)布局，也就是俗稱的DIV+CSS布局，本項(xiàng)目我們主要使用Web標(biāo)準(zhǔn)來布局頁面。 /*將頁面中的三個(gè)大區(qū)塊設(shè)置水平居中*/ }banner{ width:600px。 text