phpcmsV9靜態頁面替換動態步驟
1.先在www目錄下找到 phpcms + install_package + phpcms + templates在templates 文件夾裏建立個本身的文件夾我弄得是 ceshi 文件夾，在 ceshi 文件夾裏在建立 content 在 content 裏面新建文本 index，javascript
2.把要套的靜態網頁複製到剛建好的 index 文本里php
3.替換css
把文本里的css,js還有img樣式替換成模板裏的類型html
"css替換成"{CSS_PATH}cssjava
"ji替換成"{JS_PATH}jsjquery
"images替換成"{IMG_PATH}images數組
4.把靜態網頁分紅3部分網絡
（1）頭部，導航oop
（2）內容【除了頭和 底部剩下的都是屬於內容】測試
（3）底部，導航
5.把頭部導航，內容和底部導航分別以html文本形式保存在content文件夾裏
（1底部）footer
（3中間）index
（3頭部）header
6.切完的代碼及效果
<!--導航 結束 絕對定位-->
<!--大圖 開始-->
<div class="bigimg">
<img src="{IMG_PATH}images/bigimg1.png" />
</div>
<!--大圖 結束-->
<!--三項 開始-->
<div style="width: 100%; height: 30px;"></div>
<div class="three">
<div class="three-item">
<a href="#">
<img src="{IMG_PATH}images/three1.png" /></a>
</div>
<div class="three-item">
<a href="#">
<img src="{IMG_PATH}images/three2.png" /></a>
</div>
<div class="three-item">
<a href="#">
<img src="{IMG_PATH}images/three3.png" /></a>
</div>
<!--佔位勿刪-->
<div style="clear: both"></div>
</div>
<div style="width: 100%; height: 30px;"></div>
<!--三項 結束-->
<!--行業動態 資料庫 開始-->
<div class="dt-zlk">
<!--行業動態-->
<div class="dt-double" style="left: 18.5%;">
<!--標題-->
<div class="dt-title">
<span class="dt-sp1">行業動態</span>
<a href="#"><span class="dt-sp2" style="color: white;">更多>></span></a>
</div>
<!--展現項-->
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>
</div>
<!--資料庫-->
<div class="dt-double" style="right: 18.5%;">
<!--標題-->
<div class="dt-title">
<span class="dt-sp1">漢企一一資料庫</span>
<a href="#"><span class="dt-sp2" style="color: white;">更多>></span></a>
</div>
<!--展現項-->
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>
</div>
<img src="{IMG_PATH}images/bk1.png" />
</div>
<!--行業動態 資料庫 結束-->
<!--優秀產品展現 開始-->
<div class="yxxm">
<div class="yxxm-title">優秀產品展現</div>
<!--展現項-->
<div class="yxxm-item">
<a href="#">
<img src="{IMG_PATH}images/sss.png" /></a>
<div class="yxxm-name">
項目名稱：
<span>《圖書管理系統》</span>
</div>
<div class="yxxm-user">
客 戶：
<span>地方</span>
</div>
<div class="yxxm-context">
功 能：
<span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
</div>
<div class="yxxm-context">
開發人員：
<span>天啓超人工做室</span>
</div>
</div>
<div class="yxxm-item">
<a href="#">
<img src="{IMG_PATH}images/sss.png" /></a>
<div class="yxxm-name">
項目名稱：
<span>《圖書管理系統》</span>
</div>
<div class="yxxm-user">
客 戶：
<span>地方</span>
</div>
<div class="yxxm-context">
功 能：
<span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害</span>
</div>
<div class="yxxm-context">
開發人員：
<span>天啓超人工做室</span>
</div>
</div>
<div class="yxxm-item">
<a href="#">
<img src="{IMG_PATH}images/sss.png" /></a>
<div class="yxxm-name">
項目名稱：
<span>《圖書管理系統》</span>
</div>
<div class="yxxm-user">
客 戶：
<span>地方</span>
</div>
<div class="yxxm-context">
功 能：
<span style="width: 77%;">好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
</div>
<div class="yxxm-context">
開發人員：
<span>天啓超人工做室</span>
</div>
</div>
<div class="yxxm-item">
<a href="#">
<img src="{IMG_PATH}images/sss.png" /></a>
<div class="yxxm-name">
項目名稱：
<span>《圖書管理系統》</span>
</div>
<div class="yxxm-user">
客 戶：
<span>地方</span>
</div>
<div class="yxxm-context">
功 能：
<span style="width: 77%;">好多功能好厲害啊</span>
</div>
<div class="yxxm-context">
開發人員：
<span>天啓超人工做室</span>
</div>
</div>
<div class="yxxm-item">
<a href="#">
<img src="{IMG_PATH}images/sss.png" /></a>
<div class="yxxm-name">
項目名稱：
<span>《圖書管理系統》</span>
</div>
<div class="yxxm-user">
客 戶：
<span>地方</span>
</div>
<div class="yxxm-context">
功 能：
<span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
</div>
<div class="yxxm-context">
開發人員：
<span>天啓超人工做室</span>
</div>
</div>
<div class="yxxm-item">
<a href="#">
<img src="{IMG_PATH}images/sss.png" /></a>
<div class="yxxm-name">
項目名稱：
<span>《圖書管理系統》</span>
</div>
<div class="yxxm-user">
客 戶：
<span>地方</span>
</div>
<div class="yxxm-context">
功 能：
<span style="width: 77%;">好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊好多功能好厲害啊</span>
</div>
<div class="yxxm-context">
開發人員：
<span>天啓超人工做室</span>
</div>
</div>
<!--佔位勿刪-->
<div style="clear: both"></div>
</div>
<!--優秀產品展現 結束-->
<!--公司業務承接 開始-->
<div class="yw">
<div class="yw-title">公司業務承接</div>
<div class="yw-items">
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">1~500</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">500~1000</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">2000~5000</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">1~10000</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">1980</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">2980</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅 紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">5980</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
<div class="yw-item">
<img src="{IMG_PATH}images/ffff.png" />
<div class="yw-item-title">
日月潭紅茶
<span>www.rythc.com.cn</span>
</div>
<div class="yw-item-context">
紅茶介紹紅茶介紹紅茶介紹
</div>
<div class="yw-item-price">
<span class="price-sp">全能網站建設套餐</span>
<span class="price-sp1">價格：
<span class="price-sp2">12980</span>
元</span>
</div>
<input class="btn_buy" type="button" value="點擊訂購" />
</div>
</div>
<img src="{IMG_PATH}images/bk2.png" />
</div>
<!--公司業務承接 結束-->
<!--優秀人才推薦 開始-->
<div class="rc">
<div class="rc-title">優秀人才推薦</div>
<div class="rc-items">
<!--人才項-->
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<div class="rc-item">
<a href="#">
<img src="{IMG_PATH}images/mv.png" />
<div class="rc-item-title">孟豔茹/創意設計師</div>
</a>
<div class="rc-item-context">服務衆多品牌，擔任多家公司顧問</div>
</div>
<!--佔位勿刪-->
<div style="clear: both"></div>
</div>
</div>
<!--優秀人才推薦 結束-->
<!--聯繫咱們 開始-->
<div class="lx-context1">聯繫咱們</div>
<div class="lx-context2">若有任何疑問請聯繫咱們，咱們7*24小時竭誠爲您服務</div>
<div class="lx-context1">400-0533-575</div>
<div class="lx-items">
<div class="lx-item">
<div class="lx-item-child">
<img src="{IMG_PATH}images/lx1.png" />
<div class="lx-item-context">
<a href="#"><span class="lx-item-sp1">在線QQ客服</span><br />
</a>
<span class="lx-item-sp2">週一至週六 8:30-17:30</span>
</div>
</div>
</div>
<div class="lx-item">
<div class="lx-item-child">
<img src="{IMG_PATH}images/lx2.png" />
<div class="lx-item-context">
<a href="#"><span class="lx-item-sp1">郵箱</span><br />
</a>
<span class="lx-item-sp2">關注企業郵箱</span>
</div>
</div>
</div>
<div class="lx-item" style="border-right: 1px solid #828282;">
<div class="lx-item-child">
<img src="{IMG_PATH}images/lx3.png" />
<div class="lx-item-context">
<a href="#"><span class="lx-item-sp1">網站</span><br />
</a>
<span class="lx-item-sp2">瀏覽網站動態</span>
</div>
</div>
</div>
</div>
<div style="width: 100%; height: 50px;"></div>
<!--聯繫咱們 結束-->
<!--底部 開始-->
<script src="{JS_PATH}JS/HeaderAndFooter.js"></script>
<script src="{JS_PATH}JS/index.js"></script>
<script>
$("#btn1").click(function () {
$("#li").fadeIn();
});
$("#btn2").click(function () {
$("#li").fadeOut();
});
</script>
7.頁面都亂了，少頭部導航
加句話{template "content","header"}就有頭部導航了。template是引入模板的標籤。content文件夾。引入的是他header頭部導航
如圖
8.{template "content","footer"}<!--低腳加這句話-->
9.把頭裏面靜態內容替換成動態的
（1）把寫死的站點標題讓他不要寫死複製一句代碼
{if isset($SEO['title']) && !empty($SEO['title'])}{$SEO['title']}{/if}{$SEO['site_title']}
10.在<head>下面加上下面2句話，（1）keywords等於網站關鍵字，爲了百度能搜到作網頁用（2）description網站描述，爲了作網絡優化用
<meta name="keywords" content="{$SEO['keyword']}"> <!--keywords等於網站關鍵字，爲了百度能搜到作網頁用-->
<meta name="description" content="{$SEO['description']}"> <!--description網站描述，爲了作網絡優化用-->
11.logo是寫死的，沒換
12.導航欄，把欄目替換掉搞成活的
<div class="header-items">
<a href="#">
<div class="h-item select">首頁</div>
</a>
<div class="h-item2">/</div>
<a href="#">
<div class="h-item">產品</div>
</a>
<div class="h-item2">/</div>
<a href="#">
<div class="h-item">人才</div>
</a>
<div class="h-item2">/</div>
<a href="#">
<div class="h-item">資源</div>
</a>
<div class="h-item2">/</div>
<a href="#">
<div class="h-item">承接</div>
</a>
<div class="h-item2">/</div>
<a href="#">
<div class="h-item">動態</div>
</a>
<div class="h-item2">/</div>
<a href="#">
<div class="h-item">咱們</div>
</a>
</div>
</div>
<div class="header1"></div>
首頁不動。導航裏每項都同樣保留一項其他刪掉以後用循環讓他們都顯示，後臺有幾個就循環幾回
頭部header改完動態的樣子以下
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="{$SEO['keyword']}"><!--keywords等於網站關鍵字，爲了百度能搜到作網頁用-->
<meta name="description" content="{$SEO['description']}"><!--description網站描述，爲了作網絡優化用-->
<link href="{CSS_PATH}CSS/HeaderAndFooter.css" rel="stylesheet" />
<link href="{CSS_PATH}CSS/indexStyle.css" rel="stylesheet" />
<script src="{JS_PATH}JS/jquery-1.7.2.min.js"></script>
<title>{if isset($SEO['title']) && !empty($SEO['title'])}{$SEO['title']}{/if}{$SEO['site_title']}</title>
</head>
<body>
<div style="position: absolute; top: 0px; left: 0px; width: 100%; min-width: 1200px;">
<!--導航 開始 絕對定位-->
<div class="header">
<div class="logo-1">
<img src="{IMG_PATH}images/logo1.png" />
</div>
]
<div class="logo-2">
<img src="{IMG_PATH}images/logo1.png" />
</div>
<div class="header-items">
<!-- (1方案)-->
<!-- <a href="{siteurl($siteid)}"><!--這是個方法獲取首頁-->
<!-- <div class="h-item select">首頁</div><!--select選中變顏色-->
<!-- </a>
<div class="h-item2">/</div>-->
<!-- （2方案）-->
<!--找到父級最上面的ID等於零就是首頁-->
{if $top_parentid==0}<!--判斷首頁顯示的是否是首頁-->
<a href="{siteurl($siteid)}">
<div class="h-item select">首頁</div>
</a>
{else}
<a href="{siteurl($siteid)}">
<div class="h-item">首頁</div>
</a>
{/if}
<!--循環導航欄-->
<!--pc標籤是phpcms簡寫。pc標籤做用至關於參數-->
<!--：content表明要取的內容，由於剛找的就是內容模塊-->
<!--action="category"表明取欄目-->
<!--catid="0"零表明找全部以及菜單-->
<!--num="5"表明數量要掉幾個-->
<!--siteid="$siteid"表明站點id或者 寫1也能夠-->
<!--order排序-->
<!--order="listorder ASC"這句話的意思是根據listorder ASC升序排列-->
<!--listorder根據欄目添加的數據排序-->
{pc:content action="category" catid="0" num="25" siteid="$siteid" order="listorder ASC"}
{loop $data $r}<!--循環遍歷數組--><!--根據PC標籤裏的條件查到的$data遍歷完了就是$r。二維數組遍歷出的小數組-->
<!--<li><a href="{$r[url]}"><span>{$r[catname]}</span></a></li>-->
{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，若是是顯示的catid-->
<!-- （2方案）-->
<div class="h-item2">/</div>
<a href="{$r[url]}">
<div class="h-item select">{$r[catname]}</div>
</a>
{else}
<div class="h-item2">/</div>
<a href="{$r[url]}">
<div class="h-item">{$r[catname]}</div>
</a>
{/if}
<!-- （1方案）-->
<!--循環輸出-->
<!-- <a href="{$r[url]}"><!--url是欄目的連接-->
<!--<div class="h-item">{$r[catname]}</div><!--產品應該換成欄目名稱-->
<!-- </a>
<div class="h-item2">/</div>-->
{/loop}
{/pc}
</div>
</div>
<div class="header1"></div>
13.底腳靜態變更太
<div class="footer">
<div class="f-top">
<a href="#"><span class="f-item select">首頁</span></a>
<span>/</span>
<a href="#"><span class="f-item">產品</span></a>
<span>/</span>
<a href="#"><span class="f-item">人才</span></a>
<span>/</span>
<a href="#"><span class="f-item">資源</span></a>
<span>/</span>
<a href="#"><span class="f-item">承接</span></a>
<span>/</span>
<a href="#"><span class="f-item">動態</span></a>
<span>/</span>
<a href="#"><span class="f-item">咱們</span></a>
</div>
<div class="f-bottom">
<div class="fb-left">
<img src="{IMG_PATH}images/logo2.png" />
</div>
<div class="fb-right">
<div class="fb-right-context">
地址：張店區共青團西路富麗商城A座4樓<br />
電話：400-0533-575/0533-3113118<br />
網站：www.itnba.com<br />
郵箱：zbhq@itnba.com
</div>
</div>
</div>
</div>
<!--底部 結束-->
</div>
</body>
</html>
<script src="{JS_PATH}JS/HeaderAndFooter.js"></script>
動態
<div class="footer">
<div class="f-top">
{if $top_parentid==0}<!--判斷首頁顯示的是否是首頁-->
<a href="{siteurl($siteid)}">
<div class="h-item select">首頁</div>
</a>
{else}
<a href="{siteurl($siteid)}">
<div class="h-item">首頁</div>
</a>
{/if}
{pc:content action="category" catid="0" num="5" siteid="$siteid" order="listorder ASC"}
{loop $data $r}
{if $catid==$r[catid] || $top_parentid==$r[catid]}
<div class="h-item2">/</div>
<a href="{$r[url]}">
<div class="h-item select">{$r[catname]}</div>
</a>
{else}
<div class="h-item2">/</div>
<a href="{$r[url]}">
<div class="h-item">{$r[catname]}</div>
</a>
{/if}
{/loop}
{/pc}
</div>
<div class="f-bottom">
<div class="fb-left">
<img src="{IMG_PATH}images/logo2.png" />
</div>
<div class="fb-right">
<div class="fb-right-context">
地址：張店區共青團西路富麗商城A座4樓<br />
電話：400-0533-575/0533-3113118<br />
網站：www.itnba.com<br />
郵箱：zbhq@itnba.com
</div>
</div>
</div>
</div>
<!--底部 結束-->
</div>
</body>
</html>
<script src="{JS_PATH}JS/HeaderAndFooter.js"></script>
14.中間部份內容
（1）換大圖
<div class="bigimg">換大圖
{pc:content action="lists" catid="18" order="id DESC" num="1"}
{loop $data $val}
<img src="{$val[thumb]}" />
{/loop}
{/pc}
</div>
(2)做如圖下點擊跳轉
修改前
<!--三項 開始-->
<div style="width: 100%; height: 30px;"></div>
<div class="three">
<div class="three-item">
<a href="#"> <!--要修改的地方-->
<img src="images/three1.png" /></a>
</div>
<div class="three-item">
<a href="#">
<img src="images/three2.png" /></a>
</div>
<div class="three-item">
<a href="#">
<img src="images/three3.png" /></a>
</div>
<!--佔位勿刪-->
<div style="clear: both"></div>
</div>
<div style="width: 100%; height: 30px;"></div>
<!--三項 結束-->
修改後
<!--三項 開始-->
<div style="width: 100%; height: 30px;"></div>
<div class="three">
<div class="three-item">
<!--作軟件是承接第八個-->
<a href="{$CATEGORYS[8]['url']}">
<img src="{IMG_PATH}images/three1.png" /></a>
</div>
<div class="three-item">
<a href="{$CATEGORYS[6]['url']}">
<img src="{IMG_PATH}images/three2.png" /></a>
</div>
<div class="three-item">
<a href="{$CATEGORYS[7]['url']}">
<img src="{IMG_PATH}images/three3.png" /></a>
</div>
<!--佔位勿刪-->
<div style="clear: both"></div>
</div>
<div style="width: 100%; height: 30px;"></div>
<!--三項 結束-->
（3）把動態也換了能夠改變的
該後代碼
<!--行業動態 資料庫 開始-->
<div class="dt-zlk">
<!--行業動態-->
<div class="dt-double" style="left: 18.5%;">
<!--標題-->
<div class="dt-title">
<span class="dt-sp1">行業動態</span>
<a href="{$CATEGORYS[9][url]}"><span class="dt-sp2" style="color: white;">更多>></span></a>
</div>
<!--展現項-->
<!--保留一個循環-->
{pc:content action="lists" catid="9" order="id DESC" num="4"}
{loop $data $key $val}
<div class="dt-item">
<a href="{$val[url]}"><!--連接地址-->
<div class="dt-item-title"><!--文章標題-->{$val[title]}</div>
</a>
<div class="dt-item-context"><!--description文章的簡介-->
{$val[description]}
</div>
</div>
{/loop}
{/pc}
<!-- <div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>
<div class="dt-item">
<a href="#">
<div class="dt-item-title">漢企天啓網絡實訓員工啓動第一階段小組項目</div>
</a>
<div class="dt-item-context">
2016年12月12日上午，湊點字數看起來不那麼少湊點字數看起來不那麼少湊點字數看起來不那麼少。
</div>
</div>-->
</div>
<!--資料庫-->
<div class="dt-double" style="right: 18.5%;">
<!--標題-->
<div class="dt-title">
<span class="dt-sp1">漢企一一資料庫</span>
<a href="{$CATEGORYS[10][url]}"><span class="dt-sp2" style="color: white;">更多</span></a>
</div>
<!--展現項-->
{pc:content action="lists" catid="10" order="id DESC" num="4"}
{loop $data $key $val}
<div class="dt-item">
<a href="{$val[url]}">
<div class="dt-item-title">{$val[title]}</div>
</a>
<div class="dt-item-context">
{$val[description]}
</div>
</div>
{/loop}
{/pc}
</div>
<img src="{IMG_PATH}images/bk1.png" />
</div>
<!--行業動態 資料庫 結束-->
效果圖
15.要作的以下圖，優秀產品
（1）優秀產品
<!--標題-->
<div class="dt-title">
<span class="dt-sp1">漢企一一資料庫</span>
<a href="{$CATEGORYS[10][url]}"><span class="dt-sp2" style="color: white;">更多</span></a>
</div>
<!--展現項-->
{pc:content action="lists" catid="10" order="id DESC" num="4"}
{loop $data $key $val}
<div class="dt-item">
<a href="{$val[url]}">
<div class="dt-item-title">{$val[title]}</div>
</a>
<div class="dt-item-context">
{$val[description]}
</div>
</div>
{/loop}
{/pc}
</div>
<img src="{IMG_PATH}images/bk1.png" />
</div>
<!--行業動態 資料庫 結束-->
<!--優秀產品展現 開始-->
<div class="yxxm">
<div class="yxxm-title">優秀產品展現</div>
<!--展現項-->
{pc:content action="lists" catid="11" order="id DESC" num="6" moreinfo="1"}<!--moreinfo="1"表明查詢更多信息-->
{loop $data $key $val}
<div class="yxxm-item">
<a href="{$val[url]}"><!--產品地址-->
<img src="{$val[thumb]}" /></a><!--圖片地址-->
<div class="yxxm-name">
項目名稱：
<span>{$val[title]}</span><!--內容裏的標題-->
</div>
<div class="yxxm-user">
客 戶：
<span>{$val[keywords]}</span><!--內容裏的關鍵字-->
</div>
<div class="yxxm-context">
功 能：
<span style="width: 77%;">{$val[description]}<!--功能用簡介做--></span>
</div>
<div class="yxxm-context">
開發人員：
<span>{php list($copyfrom) = explode('|', $val['copyfrom'])}
{$copyfrom}</span><!--開發用來原做-->
</div>
</div>
{/loop}
{/pc}
運行以下
16.公司業務承接
<div class="yw">
<div class="yw-title">公司業務承接</div>
<div class="yw-items">
{pc:content action="lists" catid="8" order="id DESC" num="8"}
{loop $data $key $val}
<div class="yw-item">
<img src="{$val[thumb]}" />
<div class="yw-item-title">
{$val[title]}
</div>
<div class="yw-item-context">
{$val[description]}
</div>
<div class="yw-item-price">
<span class="price-sp">{$val['title']}</span>
<span class="price-sp1">價格：
<span class="price-sp2">{$val['keywords']}</span>
元</span>
</div>
<a href="{$val['url']}"><input class="btn_buy" type="button" value="點擊訂購" /></a>
</div>
{/loop}
{/pc}
</div>
<img src="{IMG_PATH}images/bk2.png" />
</div>
運行以下
17.優秀人才推薦
<div class="rc">
<div class="rc-title">優秀人才推薦</div>
<div class="rc-items">
<!--人才項-->
{pc:content action="lists" catid="6" order="id DESC" num="8" moreinfo="1"}
{loop $data $key $val}
<div class="rc-item">
<a href="#">
<img src="{$val[thumb]}" />
<div class="rc-item-title">{$val[title]}</div>
</a>
<div class="rc-item-context">{$val[description]}</div>
</div>
{/loop}
{/pc}
<!--佔位勿刪-->
<div style="clear: both"></div>
</div>
</div>
運行以下
18.人才裏的內容列表list.htmh(1)把頭部導航刪了（2）把頁腳刪了
（3）把頭和頁腳拿進來
【1】頭部{template "content","header"}
【2】頁腳{template "content","footer"}
運行效果以下
19.給圖片該樣式
{template "content","header"}<!--把這個頭也就是導航拿過來就行了-->
<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />
<!--導航背景-->
<div style="position: relative; width: 100%; height: 100px; background-image: url"{IMG_PATH}images/bigimg11.png);"></div>
<!--二級導航 開始-->
<div class="left">
<div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">欄目標題</div>
<div class="left-item">人才介紹</div>
<div class="left-item">標題標題</div>
<div class="left-item">李昌輝很胖</div>
<div class="left-item">測試標題</div>
<div class="left-item">選項選項選項</div>
<div class="left-item">李昌輝腰疼</div>
<div class="left-item">王胖胖</div>
</div>
<!--二級導航 結束-->
<!--列表區 開始-->
<div class="right">
<div class="list-title"> 列表標題</div>
<!--列表項-->
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<div class="right-item">
<a href="#">
<div class="item-context">《如何引用jQuery實現下拉列表，點擊展開，點擊關閉》</div>
</a>
<div class="item-time">2016-12-24</div>
</div>
<!--分頁-->
<div class="paging">
當前第[1]頁 共[10]頁 首頁 上一頁 下一頁 末頁
</div>
</div>
<!--列表區 結束-->
<div style="clear: both;"></div>
<!--友情連接 分割區-->
<div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
友情連接：
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
</div>
<!--底部 開始-->
{template "content","footer"}<!--低腳加這句話-->
<script type="text/javascript">
var oBk;
$(".right-item").hover(function () {
oBk = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk);
});
var oBk2;
$(".left-item").hover(function () {
oBk2 = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk2);
});
</script>
如上面圖中左側欄裏要讓顯示導航欄
list.html左側導航列表以及分頁
{template "content","header"}<!--把這個頭也就是導航拿過來就行了-->
<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />
<!--導航背景-->
<div style="position: relative; width: 100%; height: 100px; background-image: url({$CAT['image']});"></div>
<!--二級導航 開始-->
<div class="left">
<div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">導航</div>
<a href="{siteurl($siteid)}"><!--跳轉首頁-->
<div class="left-item">首頁</div>
</a>
{pc:content action="category" catid="0" order="listorder ASC" num="6" siteid="$siteid"}
{loop $data $r}
{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，若是是顯示的catid-->
<a href="{$r[url]}"><div class="left-item sel">{$r[catname]}</div></a>
{else}
<a href="{$r[url]}"><div class="left-item">{$r[catname]}</div></a>
{/if}
{/loop}
{/pc}
</div>
<!--二級導航 結束-->
<!--列表區 開始-->
<div class="right">
<div class="list-title"> {$CATEGORYS[$catid][catname]}列表</div>
<!--列表項-->
{pc:content action="lists" catid="$catid" order="id DESC" num="5" page="$page"}<!--實現分頁num="5" page="$page"要找第幾頁並顯示幾條-->
{loop $data $key $val}
<div class="right-item">
<a href="{$val[url]}">
<div class="item-context">{$val[title]}</div>
</a>
<div class="item-time">{$val[inputtime]}</div>
</div>
{/loop}
{/pc}
<!--分頁-->
<div class="paging">
{$pages}<!--實現分頁-->
</div>
</div>
<!--列表區 結束-->
<div style="clear: both;"></div>
<!--友情連接 分割區-->
<div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
友情連接：
{pc:link action="type_list" typeid="0" siteid="$siteid" linktype="1" order="listorder DESC" num="3" return="pic_link"}<!--return="pic_link"返回帶有圖標的-->
{loop $pic_link $v}
<a href="{$v['url']}">{$v['name']}</a>
{/loop}
{/pc}
</div>
<!--底部 開始-->
{template "content","footer"}<!--低腳加這句話-->
<script type="text/javascript">
var oBk;
$(".right-item").hover(function () {
oBk = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk);
});
var oBk2;
$(".left-item").hover(function () {
oBk2 = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk2);
});
</script>
20.人才裏的二級頁面則走的時候category.html頁面
{template "content","header"}<!--把這個頭也就是導航拿過來就行了-->
<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />
<!--導航背景-->
<div style="position: relative; width: 100%; height: 100px; background-image: url({IMG_PATH}images/bigimg11.png);"></div>
<!--二級導航 開始-->
<div class="left">
<div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">欄目標題</div>
{pc:content action="category" catid="$catid"<!--把人才分1027-0904--> order="listorder ASC" num="6" siteid="$siteid"}
{loop $data $r}
{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，若是是顯示的catid-->
<a href="{$r[url]}"><div class="left-item sel">{$r[catname]}</div></a>
{else}
<a href="{$r[url]}"><div class="left-item">{$r[catname]}</div></a>
{/if}
{/loop}
{/pc}
</div>
<!--二級導航 結束-->
<!--列表區 開始-->
<div class="right">
<div class="list-title"> {$CATEGORYS[$catid][catname]}</div>
<!--列表項-->
<div class="picitems">
<!--展現項-->
{pc:content action="lists" catid="$catid" order="id DESC" num="8" page="$page"}<!--實現分頁num="5" page="$page"要找第幾頁並顯示幾條-->
{loop $data $key $val}
<div class="pic-item">
<a href="{$val[url]}"><img src="{$val[thumb]}" /></a>
<div class="pic-item-title">{$val[title]}</div>
<div class="pic-item-title2">{$val[keywords]}</div>
<div class="pic-item-context">{$val[description]}</div>
</div>
{/loop}
{/pc}
<div style="clear: both;"></div>
</div>
<!--分頁-->
<div class="paging">
{$pages}
</div>
</div>
<!--列表區 結束-->
<div style="clear: both;"></div>
<!--友情連接 分割區-->
<div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
友情連接：
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
</div>
{template "content","footer"}<!--低腳加這句話-->
<script type="text/javascript">
var oBk2;
$(".left-item").hover(function () {
oBk2 = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk2);
});
var oBk3;
$(".pic-item").hover(function () {
oBk3 = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk3);
});
</script>
如圖下
21.人才下面又分了兩個如圖
注意：把人才分1027-0904.取父級IDcatid="$parentid"就不用去頂級IDcatid="$catid"由於是人才的分頁
代碼以下
{template "content","header"}<!--把這個頭也就是導航拿過來就行了-->
<link href="{CSS_PATH}css/ListStyle.css" rel="stylesheet" />
<!--導航背景-->
<div style="position: relative; width: 100%; height: 100px; background-image: url({IMG_PATH}images/bigimg11.png);"></div>
<!--二級導航 開始-->
<div class="left">
<div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">欄目標題</div>
{pc:content action="category" catid="$parentid"<!--把人才分1027-0904.取父級IDcatid="$parentid"就不用去頂級IDcatid="$catid"由於是人才的分頁--> order="listorder ASC" num="6" siteid="$siteid"}
{loop $data $r}
{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--判斷顯示的catid，若是是顯示的catid-->
<a href="{$r[url]}"><div class="left-item sel">{$r[catname]}</div></a>
{else}
<a href="{$r[url]}"><div class="left-item">{$r[catname]}</div></a>
{/if}
{/loop}
{/pc}
</div>
<!--二級導航 結束-->
<!--列表區 開始-->
<div class="right">
<div class="list-title"> {$CATEGORYS[$catid][catname]}</div>
<!--列表項-->
<div class="picitems">
<!--展現項-->
{pc:content action="lists" catid="$parentid"<!--catid="$parentid"取父級ID要取頂級是catid="$catid"--> order="id DESC" num="8" page="$page"}<!--實現分頁num="5" page="$page"要找第幾頁並顯示幾條-->
{loop $data $key $val}
<div class="pic-item">
<a href="{$val[url]}"><img src="{$val[thumb]}" /></a>
<div class="pic-item-title">{$val[title]}</div>
<div class="pic-item-title2">{$val[keywords]}</div>
<div class="pic-item-context">{$val[description]}</div>
</div>
{/loop}
{/pc}
<div style="clear: both;"></div>
</div>
<!--分頁-->
<div class="paging">
{$pages}
</div>
</div>
<!--列表區 結束-->
<div style="clear: both;"></div>
<!--友情連接 分割區-->
<div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
友情連接：
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
<a href="#">淄博漢企人才定製中心</a>
</div>
{template "content","footer"}<!--低腳加這句話-->
<script type="text/javascript">
var oBk2;
$(".left-item").hover(function () {
oBk2 = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk2);
});
var oBk3;
$(".pic-item").hover(function () {
oBk3 = $(this).css("background-color");
$(this).css("background-color", "#E8E8E8");
}, function () {
$(this).css("background-color", oBk3);
});
</script>
結果以下圖
點人才顯示所有，下面分1027和0904點哪一個分別顯示哪一個
相關文章
- 1. 靜態頁面(動態頁面)引入靜態頁面(動態頁面)
- 2. ecshop2.71 頁面靜態化步驟
- 3. 動態頁面，靜態頁面，僞靜態頁面的區別
- 4. 動態頁面靜態化
- 5. 靜態頁面與動態頁面
- 6. 靜態頁面和動態頁面
- 7. 動態頁面和靜態頁面
- 8. JSP中把動態頁面轉換爲靜態頁面
- 9. 頁面靜態化之動態，靜態，僞靜態概念
- 10. 靜態網頁/動態網頁/僞靜態網頁/動態HTML
- 更多相關文章...
- • IP地址分配（靜態分配+動態分配+零配置） - TCP/IP教程
- • C# 動態數組（ArrayList） - C#教程
- • 使用阿里雲OSS+CDN部署前端頁面與加速靜態資源
- • 算法總結-滑動窗口
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
相關文章
- 1. 靜態頁面(動態頁面)引入靜態頁面(動態頁面)
- 2. ecshop2.71 頁面靜態化步驟
- 3. 動態頁面，靜態頁面，僞靜態頁面的區別
- 4. 動態頁面靜態化
- 5. 靜態頁面與動態頁面
- 6. 靜態頁面和動態頁面
- 7. 動態頁面和靜態頁面
- 8. JSP中把動態頁面轉換爲靜態頁面
- 9. 頁面靜態化之動態，靜態，僞靜態概念
- 10. 靜態網頁/動態網頁/僞靜態網頁/動態HTML