五彩的div

Question

我的网站是搜索引擎返回很多很多的结果与foreach循环这样：

foreach ($xml->channel->item as $result) { 
    $ltitle = $result->title; 
    $ldesc = $result->description; 
    $url = $result->displayUrl; 
    $link = $result->link; 

    if (strlen($ltitle) > 60) 
    { 
$title = substr($ltitle,0,60).'...' ; 
    } 
    else 
    { 
    $title = $ltitle; 
    } 

if (strlen($ldesc) > 195) 
    { 
$desc = substr($ldesc,0,195).'...' ; 
    } 
    else 
    { 
    $desc = $ldesc; 
    } 


    echo " 

<br> 


<div class='resultbox'> 

<a class='normal' style='text-decoration:none;font-size:huge;font-weight:bold' href='$link'>$title</a><br> 
<div style='padding-top:3px;padding-bottom:4px;width:580px;'> 
<font style='text-decoration:none;font-size:small;font-family:Arial;'>$desc<br></font></div> 
<a style='text-decoration:none;' href='$link'><font style='text-decoration:none;font-size:small;color:green;font-weight:bold;'>$url<br></font></a> 

</div> 
"; 
} 

和上面这个

.resultbox 
{ 
height:auto; 
width:600px; 
background-color:transparent; 
font-size:19px; 
padding:10px; 
padding-left: 30px; 
padding-right: 30px; 
border-left: 6px solid #333; 
} 
.resultbox:hover 
{ 
border-left: 8px solid #555; 
} 

的风格所有结果的resultbox类边界左边的颜色是我想要改变的，我希望它能够生成颜色代码或从颜色代码列表中随机选择样式，所以＃333的结果可以是＃333＃555＃999等等。 ... 有任何想法吗？

Answer 1

变化<div class='resultbox'>到<div class='resultbox random-color-".rand(1,YOUR_COLOR_LIMIT)."'>并定义颜色，如

.random-color-1 { 
    border-left: 8px solid #555; 
} 
.random-color-2 { 
    border-left: 8px solid #555; 
} 
..... 
.random-color-YOUR_COLOR_LIMIT { 
    border-left: 8px solid #555; 
} 

Answer 2

变化

<div class='resultbox'>

到

<div class='resultbox' style='border-left-color:$yourColorInCssFormat;'>

样式属性覆盖从类的CSS。 将$yourColorInCssFormat设置为您希望用于div的颜色。例如：$yourColorInCssFormat = '#999';

Answer 3

您可以使用内嵌样式为。或者你也可以将用户第n个孩子选择CSS的重复边框颜色方案是这样的：

.resultbox:nth-child(n+1):hover { 

} 

.resultbox:nth-child(2n+1):hover { 

} 

.resultbox:nth-child(3n+1):hover { 

} 

Answer 4

如果u有使用JS没有问题，你当然可以这样做：

$(document).ready(function() { 

    $('.resultbox').mouseenter(function() { 
     var randomColor = Math.floor(Math.random()*16777215).toString(16); 
    $('.resultbox').css("border-left", " 8px solid #"+randomColor);  
    }); 
}); 

Answer 5

首先，尝试了这一点你的foreach循环：

<?php foreach ($xml->channel->item as $result): ?> 
    <?php 
     $ltitle = $result->title; 
     $ldesc = $result->description; 
     $url = $result->displayUrl; 
     $link = $result->link; 

     if (strlen($ltitle) > 60){ 
      $title = substr($ltitle,0,60).'...' ; 
     }else{$title = $ltitle;} 

     if (strlen($ldesc) > 195){ 
      $desc = substr($ldesc,0,195).'...' ; 
     }else{$desc = $ldesc;} 
    ?> 



    <div class='resultbox'> 

     <a class='normal' style='text-decoration:none;font-size:huge;font-weight:bold' href='<?php  echo $link ?>'><?php echo $title; ?></a> 
    <br> 
    <div style='padding-top:3px;padding-bottom:4px;width:580px;'> 
    <font style='text-decoration:none;font-size:small;font-family:Arial;'> 
     <?php echo $desc; ?><br> 
    </font> 
    </div> 
     <a style='text-decoration:none;' href='<?php echo $link; ?>'><font style='text- decoration:none;font-size:small;color:green;font-weight:bold;'><?php echo $url; ?><br></font> </a> 

    <?php endforeach; ?> 

你不是大玩回声这样。

现在为了生成随机颜色，你可以使用php rand（）;

例如：

//Generate a random number between the two parameters 
$randomNumber = rand(1, 3); 

//Use this number to dictate what the variable color should be 
if($randomNumber == 1){$color = "#333"} 
elseif($randomNumber == 2){$color = "#555"} 
elseif($randomNumber == 3){$color = "#999"} 

然后，您可以在代码中使用的变量$颜色随机指定的颜色之一元素。

希望这会有所帮助！

-Gui