在頁面標籤內實現隨機顏色

條件

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寫,在標籤內只能用這種取巧的方法

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章