使用CSS在div hover上从左侧推送背景颜色

Question

我有一个背景色的div。当我悬停div时改变背景颜色，但颜色应该从左侧推。只从左侧推动背景颜色。

Answer 1

检查出来：

信用到这里：Fill background color left to right CSS

一些额外的搜索可以帮助你自己。

<强>的jsfiddle

http://jsfiddle.net/75Umu/323/

ul {
    list-style-type:none;
}

ul li a {
    text-decoration:none;
}

.skillsDouble {
    float: left;
    margin-right: 1px;
}

.skillsDouble li {
    width:100px;
    padding: 11px 16px;
    text-align:center;
    float:left;
    background: #ff3232;
    /* Old browsers */
    background: linear-gradient(to right, red 50%, blue 50%);
    background-size: 200% 100%;
    background-position:right bottom;
    margin-left:10px;
    transition:all 0.2s ease;
}

.skillsDouble li:hover {
    background-position:left bottom;
}

.skillsDouble li a {
    color:white;
}