.kuan{
       border: 1px solid #1aa094;padding: 10px 0; width: 145px;height:40px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: #f2f2f2 0px 0px 10px;
    -moz-box-shadow: #f2f2f2 0px 0px 10px;
    box-shadow: #f2f2f2 0px 0px 10px;color: #1aa094;
}
.kuan0{
    position: relative;
    float: inherit;
}
.kuan:hover{
    background: #1aa094;
    color: #ffffff;
}

.kuan0:hover{
    color: #ffffff;
}
.text0 {
    float: left;
    color: #fff;
    font-size: 16px;
    line-height: 30px;
    position: relative;
    left: 50px;
    top: 16px;
}
.icon0 {
    float: left;
    position: relative;
    left: 10px;
}
.kuan h3 {
    padding-bottom:0px;
    font-size: 16px;
}

<div class="kuan panel" id="Div0">
                        <div class="icon0"><img alt="XXX" id="xxxIcon" src="15.png"
                         onmouseover="this.src='1.png'" onmouseout="this.src='15.png'" />

<!-- 此處的onmouseover 和 onmouseout 並不起作用 通過下面的js 加事件-->

</div>
                        <div class="kuan0">
                            <h3>XXXXXXX</h3><p><span id="xCount"></span>
                                 項</p>
                        </div>
                        
                  </div>

var Div0 = document.getElementById('Div0');
    var xxxIcon= document.getElementById('xxxIcon');
    Div0 .onmouseover = function(){
        xxxIcon.src = '1.png';
        Div0 .onmouseout=function(){
            xxxIcon.src = '15.png';
        }
    }