我又遇到问题了！这段JS我看不懂，想改个边框和背景不知道怎么改？

  // 鼠标放到菜品图片上显示
$(function(){

  var x = 30;
var y = 95;

$(".sc_cai_tj ul li > img").hover(function(e){
$("body").append('<div id="bigimage2">'+$("#cai_xiangqing").html()+'</div>');
  $(this).stop().fadeTo(0,0.9);
widthJudge(e);
$("#bigimage2").fadeIn(0);
},function(){
$(this).stop().fadeTo(0,1);
$("#bigimage2").remove();
  });

$(".sc_cai_tj ul li > img").mousemove(function(e){
widthJudge(e);
});

  function widthJudge(e){
var marginRight = document.documentElement.clientWidth - e.pageX; 
var imageWidth = $("#bigimage2").width();
if(marginRight < imageWidth)
{
x = imageWidth + 22;
$("#bigimage2").css({top:(e.pageY - y ) + 'px',left:(e.pageX - x ) + 'px'});
}else{
x = 22;
$("#bigimage2").css({top:(e.pageY - y ) + 'px',left:(e.pageX + x ) + 'px'});
  };
}

$(".caitu_show").each(function(){

$(this).hover(function(){

$(this).children(".caitu_img").show();
},function(){
$(this).children(".caitu_img").hide();
})
})
});
// 鼠标放到菜品图片上显示完成



就是这段代码，
下边这个是.caitu_img的样式，
.caitu_show .caitu_img {
display:none;
float:left;
position: absolute;
border:1px #248e1b solid;
padding:5px;
background:#fff;
left: 20px;
top: 15px;
z-index:999999999;
}

我想实现的效果就是：原来鼠标放到这张菜品图上会弹出一个类似于图片的小提示，上边有配料的文字，这个小提示的背景是灰色的淅变色，我不知道是怎么调的，我想把这个背景变成白色背景，绿色边框，怎么弄啊！求各位帮忙？

border background 去改改这2个试试

这个怎么改啊，我怎么打不出这个样式啊,只有border-style,border-color这些