防止子级继承转换css3

我有一个我正在转换的div,但是在这个div里面我有另一个div。现在我希望看到内部div不受其父级转换的影响,换句话说。我希望内部的div不能像他的父母那样缩放

以下是html:

<div id=“rightsection”>
<div class=“top”&gt&lt/部门>
<div class=“middle”>
<div class=“大型”>
<img src=”https://stackoverflow.com/questions/7045140/assets/images/rightpanel_expanded.png“alt=“map”title=“map”/>
&lt/部门>
&lt/部门>
<div class=“底部”>
<p>检查你的朋友们是否要去&lt/p>
&lt/部门>
&lt/部门>

这是我的css:

#右侧部分:悬停{
-moz变换:缩放(2.16,2.8)平移(-80px,-53px);
-webkit转换:比例(2.16,2.8)转换(-80px,-53px);
-o变换:标度(2.16,2.8)平移(-80px,-53px);
-ms变换:标度(2.16,2.8)平移(-80px,-53px);
变换:缩放(2.16,2.8)平移(-80px,-53px)
}

所以问题是,当我缩放#rightsection时,img会被缩放到,但我希望保持图像的原始大小

感谢您的帮助

这就是对我有用的东西

我对孩子们使用了相反的过渡。然后就稳定了

.logo{
背景:url('../images/logo background.png')不重复;
宽度:126px;
高度:127px;
利润上限:-24px;
z指数:10;
显示:块;
}
a、 标志跨度{
显示:块;
宽度:126px;
高度:127px;
背景:url('../images/logo bismi.png')不重复;
z指数:20;
文本缩进:-9999px;
文本转换:大写;
-webkit转换:-webkit转换0.4s缓解;
-moz转换:-moz转换0.4s缓解;
转换:转换0.4s缓解;
}
a、 标志:悬停跨度{
-webkit变换:rotateZ(-360度);
-莫兹变换:旋转(-360度);
变换:旋转(-360度);
}
a、 标志{
-webkit转换:-webkit转换0.4s缓解;
-moz转换:-moz转换0.4s缓解;
转换:转换0.4s缓解;
}
a、 标志:悬停{
-webkit变换:旋转(360度);
-莫兹变换:旋转(360度);
变换:旋转(360度);
}

发表评论