快捷導(dǎo)航

PHP實(shí)現(xiàn)的多彩標(biāo)簽效果代碼分享

更新時間：2014年08月21日 09:15:59 投稿：junjie

這篇文章主要介紹了PHP實(shí)現(xiàn)的多彩標(biāo)簽效果代碼分享,經(jīng)?？梢钥吹揭恍┎┛椭械臉?biāo)簽(TAGS)頁面是彩色的效果展現(xiàn),本文就給出了實(shí)現(xiàn)這個功能的PHP代碼,需要的朋友可以參考下

目前，大家的博客左側(cè)通常加上一個漂亮的多彩標(biāo)記，也想給自己的小站加一下這個小功能。

可惜已經(jīng)再不再是使用WordPress的時候那么方便了，使用WordPress的朋友們直接使用現(xiàn)成的插件，鼠標(biāo)點(diǎn)點(diǎn)就可以加上這個炫彩的功能。小站程序是自個寫的，要加這么一個功能還是得自己動手，就當(dāng)學(xué)習(xí)吧！

首先，我分析了一下目前多彩標(biāo)簽的主要表現(xiàn)形式，主要有兩點(diǎn)：顏色多樣，大小不一。這個是多彩標(biāo)簽的特性，于是想到了PHP中的隨機(jī)函數(shù)rand。直接給大小，顏色用rand隨機(jī)取值就可以。

大小的隨機(jī)值容易搞定，直接生成后連接單位即可

復(fù)制代碼代碼如下:

<?php

// 隨機(jī)大小實(shí)例

$m = rand(20,30);

echo '<span style="font-size:'.$m.'px">隨機(jī)大小</span>';

?>

生成顏色值稍微麻煩一些，因?yàn)轭伾凳鞘M(jìn)制字符表現(xiàn)形式，而隨機(jī)函數(shù)rand不能直接生成 0 到 F 這么用，最后直接用數(shù)組保存十六進(jìn)制字符，然后隨機(jī)生成鼠標(biāo)下標(biāo)這樣也可以實(shí)現(xiàn)隨機(jī)顏色

復(fù)制代碼代碼如下:

<?php

// 隨機(jī)顏色函數(shù)

// 直接返回隨機(jī)生成的色值

function getColor(){

        // 先用數(shù)組把十六進(jìn)制字符保存在一個數(shù)組中

    $arr = array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F');

        // 因?yàn)轭伾甸L度是6位，所以循環(huán)6次

    for($i=0;$i<6;$i++){

                // 隨機(jī)生成0到15數(shù)字，然后當(dāng)作數(shù)組下標(biāo)取值即可

        $color .= $arr[rand(0,15)]; 

    }

        // 返回的時候，把#號加上

    return ‘#'.$color;

}

?>

隨機(jī)大小，隨機(jī)顏色搞定后剩下的都不是問題的問題了。直接取出所有標(biāo)簽然后去重，然后遍歷數(shù)組生成HTML文本即可。

最后提點(diǎn)建議，畢竟PHP是服務(wù)器端，每次都rand會讓服務(wù)器鴨梨不?。切┨嘏５臋C(jī)器可以忽略不計(jì)，畢竟目前用VPS的還是眾多）。我們可以在博客的標(biāo)簽在發(fā)生變動的時候再生成即可，比如刪除，修改，增加文章產(chǎn)生新的標(biāo)簽時候我們再去生成多彩標(biāo)簽的HTML文本。最后這些生成的多彩簽HTML沒必要存進(jìn)數(shù)據(jù)庫，直接保存在在一個文件里，然后include即可。

目前，我的小站就是這么實(shí)現(xiàn)的。有空，我再介紹JavaScript實(shí)現(xiàn)多彩標(biāo)簽，原理也差不多一樣，只不過是JavaScript是客戶端行為，不用擔(dān)心服務(wù)器端的鴨梨，而且JavaScript交互性比較好，可以制作出具有動畫效果的云標(biāo)簽。