Home  >  Article  >  CMS Tutorial  >  How to achieve "interlaced color change" in Dream Weaver List

How to achieve "interlaced color change" in Dream Weaver List

angryTom
angryTomOriginal
2019-11-09 14:23:271920browse

How to achieve

How to achieve "interlaced color change" in Dream Weaver List

When building a corporate website or portal website, I often It is necessary to achieve the effect of changing colors on alternate rows in the article list. The method is very simple. Let’s take a look at the implementation method.

The sample code is as follows:

{dede:arclist row='12' titlelen='33' typeid='1' orderby ='pubdate'}
[field:global runphp='yes' name=autoindex]
$adminbuy.cn_a="<li class=&#39;adminbuy.cn_c&#39;>"; 
$adminbuy.cn_b="<li class=&#39;&#39;adminbuy.cn_d&#39;>";
if ((@me%2)==0) @me=$&#39;adminbuy.cn_a; 
else @me=$&#39;adminbuy.cn_b;
[/field:global]
<a href=&#39;[field:arcurl/]&#39;>[field:title/]</a>
</li>
{/dede:arclist}

As can be seen from the above example:

This code uses autoindex to increase automatically, and the number of self-increment is the same as 2 Take the modulus. When the self-increasing number %2==0 means that the self-increasing number can be divisible by 2, it is true and outputs $'adminbuy.cn_a. The code at this time It is false when

{dede:arclist row=&#39;12&#39; titlelen=&#39;33&#39; typeid=&#39;1&#39; orderby =&#39;pubdate&#39;}
<li class=&#39;&#39;adminbuy.cn_c&#39;><a href=&#39;[field:arcurl/]&#39;>[field:title/]</a></li>
{/dede:arclist}

is not divisible by 2, output $'adminbuy.cn_b, the code at this time is:

{dede:arclist row=&#39;12&#39; titlelen=&#39;33&#39; typeid=&#39;1&#39; orderby =&#39;pubdate&#39;}
<li class=&#39;&#39;adminbuy.cn_d&#39;><a href=&#39;[field:arcurl/]&#39;>[field:title/]</a></li>
{/dede:arclist}

by outputting the difference in the li tag The class style (two styles of 2l3.net_c and 2l3.net.com_d need to be defined in css) can realize interlaced color changing.

Recommended tutorial: dedecms tutorial

The above is the detailed content of How to achieve "interlaced color change" in Dream Weaver List. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn