84669 personnes étudient
152542 personnes étudient
20005 personnes étudient
5487 personnes étudient
7821 personnes étudient
359900 personnes étudient
3350 personnes étudient
180660 personnes étudient
48569 personnes étudient
18603 personnes étudient
40936 personnes étudient
1549 personnes étudient
1183 personnes étudient
32909 personnes étudient
父元素使用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); }
这里有两个连接,可以参考下: - 点我 - 再点我
设置后代:
或者让后代反向操作,比如反向旋转:
这里有两个连接,可以参考下:
- 点我
- 再点我