織夢(mèng)dede列表頁(yè)實(shí)現(xiàn)隔行_多行隨意換色_DedeCms教程
教程Tag:暫無(wú)Tag,歡迎添加,賺取U幣!
下面給大家分享一段代碼能讓織夢(mèng)dede列表頁(yè)實(shí)現(xiàn)隔行_多行隨意換色,具體代碼如下
標(biāo)簽說(shuō)明:
標(biāo)簽說(shuō)明:
arclist 標(biāo)簽下使用 [field:global.autoindex/] 默認(rèn)從1開(kāi)始
channel 標(biāo)簽下使用 [field:global.autoindex/] 默認(rèn)從0開(kāi)始
channelartlist 標(biāo)簽下使用 {dede:global.itemindex/} 默認(rèn)從1開(kāi)始
arclist 從0開(kāi)始[field:global name=autoindex runphp="yes"]@me=@me-1;[/field:global]
channel 從1開(kāi)始[field:global name=autoindex runphp="yes"]@me=@me+1;[/field:global][field:typename/]
channelartlist 從0開(kāi)始{dede:global name=itemindex runphp='yes'}@me=@me-1;{/dede:global}
channelartlist 標(biāo)簽下使用 {dede:global name='itemindex' runphp='yes'}@me;{/dede:global}
隔行換色(增加樣式),list同arclist
- <div>
- <ul>
- {dede:list pagesize='50'}
- <li>
- [field:global runphp='yes' name=autoindex]
- $a="<div id='a'>";
- $b="<div id='b'>";
- if ((@me%2)==0) @me=$a;
- else @me=$b;
- [/field:global]
- <span class="date">[[field:typelink/]][field:pubdate function="MyDate('Y-m-d',@me)"/]</span>
- <a href="[field:arcurl /]">[field:title /]</a>
- </li>
- {/dede:list}
- </ul>
- </div>
如果運(yùn)用channel弄隔行換色,需要自增從1開(kāi)始,精簡(jiǎn)寫(xiě)法如下:
- <div>
- <ul>
- {dede:channel row=6 typeid=''}
- [field:global name=autoindex runphp="yes"]((@me+1) % 2 == 0)?@me="<li class=\"last\">":@me="<li>";[/field:global]
- <h4 class="title">[field:title/]</h4>
- </li>
- {/dede:channel}
- </ul>
- </div>
隔3行(n行)換色(增加樣式)精簡(jiǎn)寫(xiě)法,替換橙色字體部分
- <div>
- <ul>
- {dede:arclist row=6 typeid=''}
- [field:global name=autoindex runphp="yes"](@me % 3 == 0)?@me="<li class=\"last\">":@me="<li>";[/field:global]
- <h4 class="title">[field:title/]</h4>
- </li>
- {/dede:arclist}
- </ul>
- </div>
多行隨意換色(增加樣式)
如果想隨機(jī)生成彩色/樣式,可以參考文章《dede優(yōu)化方法整理之:tag標(biāo)簽》
- <div>
- <ul>
- {dede:arclist typeid='8' row='6' orderby='weight'}
- [field:global runphp='yes' name=autoindex]
- $a="<li class='gd1'>";
- $b="<li class='gd2'>";
- $c="<li class='gd3'>";
- $d="<li class='gd4'>";
- $e="<li class='gd5'>";
- $f="<li class='gd6'>";
- if ((@me/1)==1) @me=$a; <!--調(diào)用的<li>次數(shù)(第一次調(diào)用)能被1整除,則該<li>對(duì)應(yīng)$a的class='gd_1'-->
- else if ((@me/2)==1) @me=$b;<!--調(diào)用的<li>次數(shù)(第二次調(diào)用)能被2整除,則該<li>對(duì)應(yīng)$b的class='gd_2'-->
- else if ((@me/3)==1) @me=$c;<!--調(diào)用的<li>次數(shù)(第三次調(diào)用)能被3整除,則該<li>對(duì)應(yīng)$c的class='gd_3'-->
- else if ((@me/4)==1) @me=$d;<!--調(diào)用的<li>次數(shù)(第四次調(diào)用)能被4整除,則該<li>對(duì)應(yīng)$d的class='gd_4'-->
- else if ((@me/5)==1) @me=$e;<!--調(diào)用的<li>次數(shù)(第五次調(diào)用)能被5整除,則該<li>對(duì)應(yīng)$e的class='gd_5'-->
- else if ((@me/6)==1) @me=$f;<!--調(diào)用的<li>次數(shù)(第六次調(diào)用)能被6整除,則該<li>對(duì)應(yīng)$f的class='gd_6'-->
- [/field:global]
- <div class="gdbox">
- <a href="[field:arcurl/]"><img src="[field:litpic/]" width="" height="" alt='[field:title function='html2text(@me)/][field:spacename/]' /></a>
- <p><a href='[field:arcurl/]'>[field:title/]</a></p>
- </div>
- </li>
- {/dede:arclist}
- </ul>
- </div>
精簡(jiǎn)寫(xiě)法
- <div>
- <ul>
- {dede:arclist row=6 typeid=''}
- <li class=gd_[field:global.autoindex]>
- <h4 class="title">[field:title/]</h4>
- </li>
- {/dede:arclist}
- </ul>
- </div>
- 公共css樣式部分
- 這里注意每張圖的在調(diào)用的時(shí)候width和height可以為空,如果是或者亂填都沒(méi)關(guān)系,靠樣式進(jìn)行定義。
- <style type="text/css">
- .gd1{width:750px;height:330px}
- .gd2{width:370px;height:165px}
- .gd3{width:185px;height:165px}
- .gd4{width:185px;height:165px}
- .gd5{width:335px;height:247px}
- .gd6{width:335px;height:247px}
- .gd1 img{width:750px;height:330px}
- .gd2 img{width:370px;height:165px}
- .gd3 img{width:185px;height:165px}
- .gd4 img{width:186px;height:165px}
- .gd5 img{width:335px;height:247px}
- .gd6 img{width:335px;height:247px}
- </style>
僅供大家學(xué)習(xí)參考,趕緊嘗試一下吧。
查看更多 DedeCms教程 織夢(mèng)模板 織夢(mèng)DedeCms視頻教程 織夢(mèng)dedecms專(zhuān)題
相關(guān)DedeCms教程:
- 織夢(mèng)dedecms首頁(yè)調(diào)用縮略圖為背景
- dedecms織夢(mèng)模板任意調(diào)用會(huì)員信息的函數(shù)教程
- dedecms快速批量刪除TAG標(biāo)簽
- dedecms模板最新文章圖片的flash調(diào)用源代碼
- 更改data目錄名稱(chēng)也可讓dedecms更安全
- 織夢(mèng)dede使用sql命令批量刪除關(guān)鍵字
- DEDECMS自動(dòng)內(nèi)鏈生成解決方法--DEDE關(guān)鍵字內(nèi)鏈
- dedecms在plus目錄調(diào)用當(dāng)前模板head.htm,footer.htm方法
- 織夢(mèng)dedecms增加英文欄目名稱(chēng)
- 織夢(mèng)CMS5.7SP1的TAGS字?jǐn)?shù)怎么改長(zhǎng)?
- dede首頁(yè)調(diào)用文章標(biāo)題|概述|所在欄目
- 默認(rèn)隱藏部分內(nèi)容,點(diǎn)擊展開(kāi)更多JS代碼
DedeCms教程教程Rss訂閱Cms教程搜索
DedeCms教程推薦
- DedeCMS 目錄權(quán)限安全設(shè)置說(shuō)明文檔
- 織夢(mèng)dedeCMS二次開(kāi)發(fā)文檔手冊(cè),文件詳解以及數(shù)據(jù)庫(kù)結(jié)構(gòu)字
- DedeCms 萬(wàn)能安全防護(hù)代碼
- DedeCms教程:優(yōu)化DedeCMS搜索結(jié)果
- 一種很酷的時(shí)間效果
- DedeCms教程:Linux+Apache+PHP+MySQL服務(wù)器環(huán)境(CentOS篇)
- 織夢(mèng)內(nèi)容管理系統(tǒng)V3(DedeCms V3)簡(jiǎn)介
- 織夢(mèng)網(wǎng)站系統(tǒng)添加迅雷專(zhuān)用鏈接(視頻教程)
- DedeCms教程:DedeCMS站點(diǎn)高級(jí)安全策略(Linux篇)
- 織夢(mèng)DedeCMS模板可以使用的公共函數(shù)集合
猜你也喜歡看這些
- 織夢(mèng)html5品牌公司企業(yè)集團(tuán)網(wǎng)站模板(帶測(cè)試數(shù)據(jù))
- 織夢(mèng)CMS紅灰色大氣網(wǎng)絡(luò)工作室網(wǎng)站模板
- 織夢(mèng)模板養(yǎng)生資訊,帶數(shù)據(jù),SEO優(yōu)化
- 響應(yīng)式生物科技醫(yī)療行業(yè)網(wǎng)站模板
- 織夢(mèng)dedecms電子數(shù)碼產(chǎn)品/移動(dòng)充電器企業(yè)網(wǎng)站模板 帶圖集功能
- dedecms 紅藍(lán)風(fēng)格機(jī)械類(lèi)企業(yè)網(wǎng)站模板
- dedecms生態(tài)園林公司企業(yè)網(wǎng)站模板
- dede婚紗攝影藝術(shù)照兒童寫(xiě)真工作室通用織夢(mèng)模板
- dedecms紅色企業(yè)網(wǎng)站模板(產(chǎn)品展示)
- dedecms模板機(jī)械企業(yè)模板 黑紅色
- 相關(guān)鏈接:
復(fù)制本頁(yè)鏈接| 搜索織夢(mèng)dede列表頁(yè)實(shí)現(xiàn)隔行_多行隨意換色| DedeCms模板| Dede模板| 織夢(mèng)模板| dedecms
- 教程說(shuō)明:
DedeCms教程-織夢(mèng)dede列表頁(yè)實(shí)現(xiàn)隔行_多行隨意換色。