Home > CMS Tutorial > DEDECMS > body text

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

angryTom
Release: 2019-11-09 14:23:27
Original
1929 people have browsed it

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

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}
Copy after login

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}
Copy after login

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}
Copy after login

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!

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template