HTML CSS網(wǎng)頁(yè)實(shí)訓(xùn)
時(shí)間:2023-10-02 01:42:01 | 來(lái)源:網(wǎng)站運(yùn)營(yíng)
時(shí)間:2023-10-02 01:42:01 來(lái)源:網(wǎng)站運(yùn)營(yíng)
HTML CSS網(wǎng)頁(yè)實(shí)訓(xùn):?頁(yè)面設(shè)計(jì)主要應(yīng)用HTML超文本標(biāo)記語(yǔ)言和CSS,使用現(xiàn)在主流的CSS+DIV方式布局。采用外部樣式表,使內(nèi)容與樣式分離,從而精簡(jiǎn)代碼。
注冊(cè)和登錄頁(yè)面模仿的華為登錄界面,當(dāng)然,看起來(lái)稍微有點(diǎn)相似,實(shí)際差別還是很大的。畢竟我們現(xiàn)在只學(xué)習(xí)了HTML AND CSS。
用戶端程序流程
管理員端程序流程
下面展示部分頁(yè)面,原碼可以關(guān)注微信公眾號(hào)小興且愛(ài)學(xué)獲取。
主頁(yè)登錄頁(yè)面如上,采用div+css方式布局,分為上中下三部分。
注冊(cè)頁(yè)如上,采用div+css方式布局,分為上中下三部分,而中間又分為兩個(gè)div,左側(cè)是button按鈕,右側(cè)表格與表單相結(jié)合,使排版更加整齊。
主頁(yè)
主頁(yè)采用采用div+css布局,分為A,B,C,D,E,F六個(gè)部分。A部分為一菜單欄和登錄注冊(cè)等操作按鈕;B部分從左到右一分為三,B1為logo,B2為橫向菜單欄,B3為搜索框;C部分由2個(gè)div構(gòu)成,左側(cè)為縱向菜單欄,右側(cè)為一個(gè)展示圖片;D部分為商品展示區(qū),上方為商品品牌,下方左側(cè)為一div,右側(cè)是8個(gè)div排列;E與D相同;F為頁(yè)面的尾部,展示版權(quán)等信息。A,B,C三部分主要應(yīng)用了無(wú)序列表標(biāo)簽<ul>。