84669 人が学習中
152542 人が学習中
20005 人が学習中
5487 人が学習中
7821 人が学習中
359900 人が学習中
3350 人が学習中
180660 人が学習中
48569 人が学習中
18603 人が学習中
40936 人が学習中
1549 人が学習中
1183 人が学習中
32909 人が学習中
父元素使用css3的transform属性后,子元素也会跟着扭曲,如何让子元素不受影响?先谢谢各位了!比如父元素transform: translate3d(x, y, z) 后,子元素能不能也加上旋转的属性,把自己转回来?
ringa_lee
设置后代:
.children1, .children2, .childrenN { -moz-transform: none; -webkit-transform: none; -o-transform: none; -ms-transform: none; transform: none; }
或者让后代反向操作,比如反向旋转:
.parent { position: relative; background-color: yellow; width: 200px; height: 150px; margin: 70px; -webkit-transform: rotate(30deg); -moz-transform: rotate(30deg); -o-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); } .child { position: absolute; top: 30px; left: 50px; background-color: green; width: 70px; height: 50px; -webkit-transform: rotate(-30deg); -moz-transform: rotate(-30deg); -o-transform: rotate(-30deg); -ms-transform: rotate(-30deg); transform: rotate(-30deg); }
这里有两个连接,可以参考下:- 点我- 再点我
设置后代:
或者让后代反向操作,比如反向旋转:
这里有两个连接,可以参考下:
- 点我
- 再点我