君子以泽,武道至尊帝临小说,欢乐颂第三季

在網(wǎng)上流傳很廣,壇子里也有幾個(gè)人都轉(zhuǎn)過,這里說下怎么用(教程以默認(rèn)模板為例).
一.內(nèi)容頁(yè)分頁(yè)代碼修改
首先介紹下基礎(chǔ)知識(shí),dede的內(nèi)容頁(yè)調(diào)用標(biāo)記是:

復(fù)制代碼代碼如下:

<div class="cupage">{dede:pagebreak/}</div>

生成html后形式為:

復(fù)制代碼代碼如下:

<div class="cupage"><a href='#'>上一頁(yè)</a><strong>1</strong><a href='#'>2</a> <a href='#'>下一頁(yè)</a></div> 

這里分析下,cupage的class控制整個(gè)分頁(yè)區(qū)域的樣式,"上一頁(yè)"和"下一頁(yè)"的樣式可以通過控制A標(biāo)簽的樣式來更改,而當(dāng)前頁(yè),比如這里的"1"是用
<strong></strong>標(biāo)記包圍的,當(dāng)然可以通過定義<strong>標(biāo)記的樣式實(shí)現(xiàn)當(dāng)前頁(yè)碼與其他頁(yè)碼的樣式不同.
然后再分析下下載的翻頁(yè)效果代碼,我們以第一個(gè)Digg Style為例.
首先看下Digg Style的html代碼:

復(fù)制代碼代碼如下:

<div class="digg"> 
<span class="disabled"> < </span> 
<span class="current">1</span> 
<a href="#?page=2">2</a><a href="#?page=3">3</a><a href="#?page=4">4</a><a href="#?page=5">5</a><a href="#?page=6">6</a><a href="#? 
page=7">7</a>...<a href="#?page=199">199</a><a href="#?page=200">200</a> 
<a href="#?page=2"> > </a> 
</div> 

名為digg的class跟cupage作用一樣,控制整個(gè)分頁(yè)區(qū)域的樣式,它這里的上一頁(yè)和下一頁(yè)用<和>代替了,而且設(shè)置了不同的樣式,因?yàn)槿绻诘谝豁?yè)的話,上一頁(yè)
這個(gè)鏈接是不可用的,所以區(qū)別了下一頁(yè)的樣式,但是dede在這里有個(gè)bug,從生成的html的代碼也可以看出,當(dāng)頁(yè)碼在第一頁(yè)的時(shí)候,那個(gè)上一頁(yè)依然是可點(diǎn)的,這個(gè)后面會(huì)給出解決方法.名為current的class控制的是當(dāng)前頁(yè)碼的樣式,這個(gè)和dede的<strong>標(biāo)簽的樣式是一樣的作用,像2.3...這樣的頁(yè)碼樣式和dede的一樣,都用的是A標(biāo)簽,把這里的A標(biāo)簽的css搬到dede里就行了.
好了,分析到這就可以對(duì)照著Digg Style的css重寫dede的分頁(yè)css了,
Digg Style的css:

復(fù)制代碼代碼如下:

DIV.digg { 
PADDING-RIGHT: 3px; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; TEXT-ALIGN: center 
} 
DIV.digg A { 
BORDER-RIGHT: #aaaadd 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #aaaadd 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 
2px; BORDER-LEFT: #aaaadd 1px solid; COLOR: #000099; PADDING-TOP: 2px; BORDER-BOTTOM: #aaaadd 1px solid; TEXT-DECORATION: none 
} 
DIV.digg A:hover { 
BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #000; BORDER-BOTTOM: #000099 
1px solid 
} 
DIV.digg A:active { 
BORDER-RIGHT: #000099 1px solid; BORDER-TOP: #000099 1px solid; BORDER-LEFT: #000099 1px solid; COLOR: #000; BORDER-BOTTOM: #000099 
1px solid 
} 
DIV.digg SPAN.current { 
BORDER-RIGHT: #000099 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #000099 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING- 
BOTTOM: 2px; MARGIN: 2px; BORDER-LEFT: #000099 1px solid; COLOR: #fff; PADDING-TOP: 2px; BORDER-BOTTOM: #000099 1px solid; BACKGROUND-COLOR: 
#000099 
} 
DIV.digg SPAN.disabled { 
BORDER-RIGHT: #eee 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eee 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; MARGIN: 2px; 
BORDER-LEFT: #eee 1px solid; COLOR: #ddd; PADDING-TOP: 2px; BORDER-BOTTOM: #eee 1px solid 
} 

123下一頁(yè)閱讀全文

標(biāo)簽：上海內(nèi)蒙古山南廣安保定陜西吳忠清遠(yuǎn)

巨人網(wǎng)絡(luò)通訊聲明：本文標(biāo)題《DEDECMS實(shí)用漂亮的翻頁(yè)效果修改方法第1/3頁(yè)》，本文關(guān)鍵詞 DEDECMS,實(shí)用,漂,亮的,翻頁(yè),；如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題，煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們，我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò)，涉及言論、版權(quán)與本站無關(guān)。