2

だから私は CSS3 に慣れようとしていて、レイアウトに素晴らしい効果を与えるのでトランジションから始めようと思ったので、コードを使用しました。

<!DOCTYPE html>
<html>
<head>
<style>

div
{
width:40px;
height:60px;
opacity:0.4;
background:black;
transition:all 2s;
-moz-transition:all 2s; /* Firefox 4 */
-webkit-transition:all 2s; /* Safari and Chrome */
-o-transition:all 2s; /* Opera */
}

div:hover
{
width:90px;
opacity:0.9;
}
</style>
</head>
<body>
<br>
<u><b><center>TEST</center></b></u>

<div></div>

</body>
</html>
<br>

そのコードを使用するたびに、レイアウトが完全に台無しになり、ほとんど何も残らず、すべてがトランジションで間違った位置に置かれます。コーディングに何か問題があることを誰かが見つけることができますか?

[編集] これが起こることです - http://testingforsite.weebly.com/

4

1 に答える 1

1

div に id を与えると役に立ちます。このように記述すると、CSS によって Web サイトのすべての div が変更されるためです。

HTML:

<div id="div-of-transition"></div>

CSS:

#div-of-transition{
   transition:all 2s;
   -moz-transition:all 2s; /* Firefox 4 */
   -webkit-transition:all 2s; /* Safari and Chrome */
   -o-transition:all 2s; /* Opera */

これは、名前を付けた div のみを変更しますdiv-of-transition

于 2012-11-21T17:52:00.303 に答える