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 会改变你网站上的所有 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 */

这只会更改您命名的 divdiv-of-transition

于 2012-11-21T17:52:00.303 回答