PHP實(shí)現(xiàn)的多彩標(biāo)簽效果代碼分享
目前,大家的博客左側(cè)通常加上一個(gè)漂亮的多彩標(biāo)記,也想給自己的小站加一下這個(gè)小功能。
可惜已經(jīng)再不再是使用WordPress的時(shí)候那么方便了,使用WordPress的朋友們直接使用現(xiàn)成的插件,鼠標(biāo)點(diǎn)點(diǎn)就可以加上這個(gè)炫彩的功能。小站程序是自個(gè)寫(xiě)的,要加這么一個(gè)功能還是得自己動(dòng)手,就當(dāng)學(xué)習(xí)吧!
首先,我分析了一下目前多彩標(biāo)簽的主要表現(xiàn)形式,主要有兩點(diǎn):顏色多樣,大小不一。這個(gè)是多彩標(biāo)簽的特性,于是想到了PHP中的隨機(jī)函數(shù)rand。直接給大小,顏色用rand隨機(jī)取值就可以。
大小的隨機(jī)值容易搞定,直接生成后連接單位即可
<?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ī)顏色
<?php
// 隨機(jī)顏色函數(shù)
// 直接返回隨機(jī)生成的色值
function getColor(){
// 先用數(shù)組把十六進(jìn)制字符保存在一個(gè)數(shù)組中
$arr = array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F');
// 因?yàn)轭伾甸L(zhǎng)度是6位,所以循環(huán)6次
for($i=0;$i<6;$i++){
// 隨機(jī)生成0到15數(shù)字,然后當(dāng)作數(shù)組下標(biāo)取值即可
$color .= $arr[rand(0,15)];
}
// 返回的時(shí)候,把#號(hào)加上
return ‘#'.$color;
}
?>
隨機(jī)大小,隨機(jī)顏色搞定后剩下的都不是問(wèn)題的問(wèn)題了。直接取出所有標(biāo)簽然后去重,然后遍歷數(shù)組生成HTML文本即可。
最后提點(diǎn)建議,畢竟PHP是服務(wù)器端,每次都rand會(huì)讓服務(wù)器鴨梨不?。切┨嘏5臋C(jī)器可以忽略不計(jì),畢竟目前用VPS的還是眾多)。我們可以在博客的標(biāo)簽在發(fā)生變動(dòng)的時(shí)候再生成即可,比如刪除,修改,增加文章產(chǎn)生新的標(biāo)簽時(shí)候我們?cè)偃ド啥嗖蕵?biāo)簽的HTML文本。最后這些生成的多彩簽HTML沒(méi)必要存進(jìn)數(shù)據(jù)庫(kù),直接保存在在一個(gè)文件里,然后include即可。
目前,我的小站就是這么實(shí)現(xiàn)的。有空,我再介紹JavaScript實(shí)現(xiàn)多彩標(biāo)簽,原理也差不多一樣,只不過(guò)是JavaScript是客戶端行為,不用擔(dān)心服務(wù)器端的鴨梨,而且JavaScript交互性比較好,可以制作出具有動(dòng)畫(huà)效果的云標(biāo)簽。
相關(guān)文章
thinkphp實(shí)現(xiàn)發(fā)送郵件密碼找回功能實(shí)例
這篇文章主要介紹了thinkphp實(shí)現(xiàn)發(fā)送郵件密碼找回功能的方法,以實(shí)例形式詳細(xì)講述了配置文件與功能代碼的實(shí)現(xiàn)方法,是非常實(shí)用的技巧,需要的朋友可以參考下2014-12-12php中實(shí)現(xiàn)用數(shù)組嫵媚地生成要執(zhí)行的sql語(yǔ)句
這篇文章主要介紹了php中實(shí)現(xiàn)用數(shù)組嫵媚地生成要執(zhí)行的sql語(yǔ)句,本文直接給出代碼示例,需要的朋友可以參考下2015-07-07淺談laravel-admin form中的數(shù)據(jù),在提交后,保存前,獲取并進(jìn)行編輯
今天小編就為大家分享一篇淺談laravel-admin form中的數(shù)據(jù),在提交后,保存前,獲取并進(jìn)行編輯,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-10-10laravel使用redis隊(duì)列實(shí)例講解
這篇文章主要介紹了laravel使用redis隊(duì)列實(shí)例講解,使用laravel框架之后配置redis還是很簡(jiǎn)單的,有感興趣的同學(xué)可以學(xué)習(xí)下2021-03-03thinkPHP自動(dòng)驗(yàn)證機(jī)制詳解
這篇文章主要介紹了thinkPHP自動(dòng)驗(yàn)證機(jī)制,結(jié)合實(shí)例形式分析了thinkPHP自動(dòng)驗(yàn)證機(jī)制的格式、原理與具體操作技巧,需要的朋友可以參考下2016-12-12PHP PDO預(yù)處理語(yǔ)句及事務(wù)的使用
今天這篇文章,我們來(lái)簡(jiǎn)單的學(xué)習(xí)一下 PDO 中的預(yù)處理語(yǔ)句以及事務(wù)的使用,它們都是在 PDO 對(duì)象下的操作,而且并不復(fù)雜,簡(jiǎn)單的應(yīng)用都能很容易地實(shí)現(xiàn)。只不過(guò)大部分情況下,大家都在使用框架,手寫(xiě)的機(jī)會(huì)非常少。2021-06-06從零開(kāi)始學(xué)YII2框架(三)擴(kuò)展插件yii2-gird
yii2-gird 插件是Yii2.0的一個(gè)擴(kuò)展。它在官方的girdview基礎(chǔ)上擴(kuò)展了一些實(shí)用的功能。非常好用,推薦使用哦。2014-08-08使用Rancher在K8S上部署高性能PHP應(yīng)用程序的教程
這篇文章主要介紹了使用Rancher在K8S上部署高性能PHP應(yīng)用程序,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-07-07