CSS3トランジションは、私は、このCSSコードとどの私はこれが私のCSSでそれを</p> <p>を修正することができますので、その誰もが間違っているものを私に言うことができる私は移行を持って自分のスタイルに追加しますが、それは動作しませんを持って

Question

を動作しません。コード

div p 
{ 
-webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */ 
transition: width 2s; 

} 
div:hover p 
{ 
    width: 300px; 
} 

この私のhtmlコード

<div><p style='background-color:blue'>Hello</p></div> 

Answer 1

ちょうど

width: 100%; 

を追加していますあなたの div p { }への

とそれが動作します。 CSSの開始値と終了値を与える必要があります。

だから、あなたの最後のCSSは次のようになります。

div p { 
    -webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */ 
    transition: width 2s; 
    width: 100%; 
} 

div:hover p { 
    width: 200px; 
} 

Answer 2

あなたが開始幅を必要とする、フィドルhttps://jsfiddle.net/7gqo4o1h/4/

div p 
{ 
width: 100%; 
-webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */ 
transition: width 2s; 

} 
div:hover p 
{ 
    width: 300px; 
}