花魁直播高品质美女在线视频互动社区 - 花魁直播官方版

 歡迎來到素材無憂網(wǎng),按 + 收藏我們
登錄 注冊 退出 找回密碼

discuzX教程教你如何把切割好的html頁面轉(zhuǎn)換成可供DIY的頁面（高

時間： 2019-05-29 11:11 閱讀： 次 作者：素材無憂網(wǎng)

今天給大家講講 如何把已經(jīng)切割好的html頁面或者模仿的頁面轉(zhuǎn)換成可供DIY的頁面

請跟隨教程一步一步操作  如有疑問請?zhí)岢?nbsp;



以下以家居頻道為例為大家講解

我們常見的切割好的html頁面包含這么幾個元素 

如下圖  圖片文件夾、CSS文件夾、其它文件或圖片文件夾、一個html頁面  

1.gif




大家看下頁面效果
 

2.png



接下來，我們就把這個頁面轉(zhuǎn)換成DIY頁面  

首頁我們用編輯工具打開 index.html頁面

我們?yōu)榱四軌蚴褂媒y(tǒng)一的頭部樣式，這里面我們引入系統(tǒng)內(nèi)置的頭部文件（header）把頁面中的關(guān)于頭部的信息刪除

如下圖所示

3.png





把系統(tǒng)頭部（header）引入進來 

引用代碼
  1. <!--{subtemplate common/header}-->
復(fù)制代碼 如下圖所示 

4.png




給新的模板起個名字 

如下代碼
  1. <!--[name]家居頻道模板[/name]-->
復(fù)制代碼 如下圖所示

5.png




接下來增加可供DIY的CSS樣式表

如下代碼
  1. <style id="diy_style" type="text/css"></style>
復(fù)制代碼 如下圖所示

6.png




頭部

接下來更換底部代碼  

找到底部代碼刪除掉 換成系統(tǒng)內(nèi)置的通用底部代碼   

如下圖所示


7.png




增加如下代碼
  1. <!--{subtemplate common/footer}-->
復(fù)制代碼 如下圖所示

9.png

版權(quán)聲明： 本站資源均來自互聯(lián)網(wǎng)或會員發(fā)布，如果侵犯了您的權(quán)益請與我們聯(lián)系，我們將在24小時內(nèi)刪除！謝謝！

轉(zhuǎn)載請注明： discuzX教程教你如何把切割好的html頁面轉(zhuǎn)換成可供DIY的頁面（高

標(biāo)簽：  
相關(guān)文章
模板推薦