小技巧解决大问题-轻松解决随机彩色问题

利用随机数以及动态 class 的方法，我们这边可以做出很多漂亮的色彩搭配，今天就来看下。

前言

第一个方案

第一个方案简单粗暴，主要是使用了随机数函数，我们都知道颜色代码都是这样的#ffffff 或者这样的#000000,这两个分别是白色以及黑色，那么我们是否认为随机的 6 个数字都是一个颜色？那么应该明白我说的吧。

<?php
 $color = dechex(rand(0,16777215));
  $content = '<div style="background-color: #'.$color.';" id="" class="">XXOO</div>';
  echo $content;
?>

这个代码好处就是简单，而且颜色很多
坏处就是颜色不能控制，可能出现和背景或者文字颜色冲突的情况，另外纯数字颜色质量不太好。

第二方案

这里云落使用的是第二种方案，也是目前我的导航页面正在用的方案，当然也是使用了随机函数的，这里采用的是叫做动态 class 的技术，看下代码很简单。

<?php
 $color = mt_rand(1, 3);
  $content = '<div id="" class="color_'. $content .'">XXOO</div>';
  echo $content;
?>
<style type="text/css">
	.color_1{xx:oo;}.color_2{xx:oo;}.color_3{xx:oo;}
</style>

这里的好处就是色彩可以以及选择控制，不至于出现乱配色的情况。
坏处嘛，就是代码稍微多了点。

后语

代码虽然是瞎写的，比较污，但是思路知道就行，这里云落自己记录下，用到的地方其实很多的，就酱紫。听个歌《你的名字》

扫码订阅，第一时间获得更新

微信扫码二维码，订阅我们网站的动态，另外不定时发送 WordPress 小技巧，你可以随时退订，欢迎订阅哦~