html - ボーダーの CSS3 トランジション

Question

リスト項目にカーソルを合わせたときに赤い境界線のトランジションを追加しようとしていますが、トランジションはホバーしたときにのみ機能します。

赤い境界線にトランジションを追加して、ホバーオフしたときにスライドアウトすることはできますか? ここにコードがありますhttp://jsbin.com/ewilix/3/edit

Answer 1

ホバー状態の場合と同じように、最初の左境界線に同じプロパティを指定する必要がありますが、幅は 0 です。

#conteneur-menu2 ul li a {
    text-decoration: none;
    font-size: 25px;
    padding: 4px;
    display: block;
    color: white;
    width: 230px; 
    transition: all 2s;
    line-height: 20px;
    border-left-style: solid;
    border-left-color: red;
    border-left-width: 0px;
}