html西式甜品網(wǎng)制作-預(yù)覽頁(yè)
【正文】 nav begin 13 div class=nav/div 14 !nav end 15 !banner begin 16 div class=banner/div 17 !banner end 18 !list begin 19 div class=list/div 20 !list end 21 !content begin 22 div class=content/div 23 !content end 24 !footer begin 25 div class=footer/div 26 !footer end 27 /body 28 /html在上述代碼中，通過(guò)給div添加不同的類(lèi)名來(lái)定義頁(yè)面中的各個(gè)模塊。 padding:0。fontsize:16px。圖43 “頭部”模塊結(jié)構(gòu)圖（2）樣式分析“頭部”模塊的寬為980px，通過(guò)設(shè)置外邊距屬性使其在頁(yè)面中居中顯示，并設(shè)置相對(duì)定位。具體如下： 1 .head{ 2 width:980px。 6 } 7 .logo{ 8 position: absolute。 14 right:100px。 18 fontsize: 18px。導(dǎo)航內(nèi)容部分由span標(biāo)記定義，banner圖由img標(biāo)記定義。最后還需設(shè)置“banner”模塊的圖片在頁(yè)面中居中顯示。 3 height:50px。 9 lineheight: 50px。 15 padding:0 38px。}上述代碼中，第8行和第19行代碼分別用于設(shè)置導(dǎo)航內(nèi)容部分和banner圖片在頁(yè)面中居中顯示。圖47 “產(chǎn)品分類(lèi)”模塊結(jié)構(gòu)圖（2）樣式分析“產(chǎn)品分類(lèi)”模塊的背景色通欄顯示，因此需設(shè)置最外層div的寬度100%，內(nèi)部嵌套的div寬度為980px，且在頁(yè)面中居中顯示。具體如下： 1 .list{ 2 width:100%。 8 height:195px。 14 width:146px。 18 background: url(../images/) norepeat。} 23 .list .list_in .list3{background: url(../images/) norepeat。，刷新頁(yè)面，效果如圖48所示。定義每一個(gè)展示模塊的div標(biāo)記左浮動(dòng)，并定義相關(guān)的文字樣式。 3 height:570px。 9 margin:0 auto。 15 border:1px solid ccc。 19 fontsize: 14px。 25 } 26 .con .con_type {color:fd8187。 33 width:158px。圖410 “產(chǎn)品展示”模塊效果圖制作版權(quán)信息模塊（1）HTML結(jié)構(gòu)分析“版權(quán)信息”模塊由div標(biāo)記定義。具體如下： 1 !footer begin 2 div class=footer西式甜品網(wǎng)版權(quán)所有20002016京ICP備08001421號(hào)amp。京公網(wǎng)安備110108007702/div 3 !footer end（4）定義樣式，用于控制“版權(quán)信息”模塊。 5 height:120px。 9 color:fff?！鞍鏅?quán)信息”模塊效果圖1. 若不給自己設(shè)限，則人生中就沒(méi)有限制你發(fā)揮的藩籬。有時(shí)候覺(jué)得自己像個(gè)神經(jīng)病。歲月是有情的，假如你奉獻(xiàn)給她的是一些色彩，它奉獻(xiàn)給你的也是
公司管理相關(guān)推薦
鄂ICP備17016276號(hào)-1