欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

在页面标签内实现随机颜色

程序员文章站 2022-07-13 15:17:11
...

条件

jstl,有一个数字返回值

原理:

将这个数字对某个数字取余,然后设定颜色。

例子:

<div class="tagcloud">
            <c:forEach items="${tagList}" var="tag">
                <c:if test="${tag.tagId%5==0}">
	                <a href="/tag/${tag.tagId}"
	                   class="tag-link-129 tag-link-position-1" title="${tag.articleCount}个话题"
	                   style="font-size: 14px;color:#BF3EFF">
	                        ${tag.tagName}
	                </a>
                </c:if>
                <c:if test="${tag.tagId%5==1}">
	                <a href="/tag/${tag.tagId}"
	                   class="tag-link-129 tag-link-position-1" title="${tag.articleCount}个话题"
	                   style="font-size: 14px;color:#B0E2FF">
	                        ${tag.tagName}
	                </a>
                </c:if>
                <c:if test="${tag.tagId%5==2}">
	                <a href="/tag/${tag.tagId}"
	                   class="tag-link-129 tag-link-position-1" title="${tag.articleCount}个话题"
	                   style="font-size: 14px;color:#F08080">
	                        ${tag.tagName}
	                </a>
                </c:if>
                <c:if test="${tag.tagId%5==3}">
	                <a href="/tag/${tag.tagId}"
	                   class="tag-link-129 tag-link-position-1" title="${tag.articleCount}个话题"
	                   style="font-size: 14px;color:#CD9B1D">
	                        ${tag.tagName}
	                </a>
                </c:if>
                <c:if test="${tag.tagId%5==4}">
	                <a href="/tag/${tag.tagId}"
	                   class="tag-link-129 tag-link-position-1" title="${tag.articleCount}个话题"
	                   style="font-size: 14px;color:#00C5CD">
	                        ${tag.tagName}
	                </a>
                </c:if>
                
            </c:forEach>
            <div class="clear"></div>
        </div>

不想用JS写,在标签内只能用这种取巧的方法

相关标签: 随机颜色