css3改變圖標(biāo)顏色骚揍，用到filter（濾鏡）這個屬性（注意缭付，是需要純色的圖片跨嘉，白色背景或者透明背景的圖片）抗悍，下面看例子吧

<div class="main">
            <img class="img1" src="http://img.tgimg.cn/Home/share-icon.png" /><br />
            <img class="img2" src="http://img.tgimg.cn/Mproject/v5/new_subscribe.png" /><br />
            <img class="img3" src="http://img.tgimg.cn/Project/newLogin/close-btn-hover.png" /><br />
            <img class="img4" src="http://img.tgimg.cn/Project/newJuniorDetail/contacts-ico.png" /><br />
            <img class="img5" src="http://img.tgimg.cn/Project/newJuniorDetail/query-icon.png" /><br />
            <img class="img6" src="http://img.tgimg.cn/Project/newJuniorDetail/close-photo-pop.png" /><br />
        </div>

.img1 {
    display: block;
    width: 22px;
    height: 24px;
    background: url('http://img.tgimg.cn/Home/share-icon.png');
    -webkit-filter: drop-shadow(200px 0 0 #f60);
    /* Chrome, Safari, Opera */
    filter: drop-shadow(200px 0 0 #f60);
}

.img2 {
    display: block;
    width: 196px;
    height: 196px;
    background: url('http://img.tgimg.cn/Mproject/v5/new_subscribe.png');
    -webkit-filter: drop-shadow(200px 0 0 #f60);
    filter: drop-shadow(200px 0 0 #f60);
}

.img3 {
    display: block;
    width: 16px;
    height: 16px;
    background: url('//img.tgimg.cn/Project/newLogin/close-btn-hover.png');
    -webkit-filter: drop-shadow(200px 0 0 #f60);
    filter: drop-shadow(200px 0 0 #f60);
}

.img4 {
    width: 67px;
    height: 72px;
    -webkit-filter: drop-shadow(200px 0 0 #f60);
    filter: drop-shadow(200px 0 0 #f60);
}

.img5 {
    width: 66px;
    height: 66px;
    -webkit-filter: drop-shadow(200px 0 0 #f60);
    filter: drop-shadow(200px 0 0 #f60);
}

.img6 {
    width: 24px;
    height: 24px;
    -webkit-filter: drop-shadow(200px 0 0 #f60);
    filter: drop-shadow(200px 0 0 #f60);
}

看圖

574b0e39c521f7e65b31c0a72d5889d.png