1回答

好帮手慕鹤

2020-10-07

已采纳

同学你好。

1、视频中左侧导航使用left: -150px进行定位也是可以的，这是因为在代码中，.slide-bar容器设置了定位，所以可以使用left：-150px来实现效果。在视频中，使用的transform: translate3d(150px, 0, 0);是直接把当前元素进行了平移，不需要去设置定位的样式，再通过left属性，来改变元素的位置。但是在给body添加类名.active的时候，使用left的话，还需要再添加上定位效果，但是添加上了定位之后，它改变的是自身的位置，并且使用了定位，body还会覆盖在显示的内容上，布局会出错，如下：

所以老师再讲解的时候，使用的 transform: translate3d(150px, 0, 0);来改变它们的位置。

2、一般在做比较特殊的布局时，建议使用position定位，例如：

内容需要覆盖在某个区域的时候，使用定位来实现效果。

参考代码：

或者是浏览器上固定某个位置有广告显示，也需要去使用定位来实现这样的效果，参考下图：

而tanslate只是用来改变元素的位置，如果只需要改变元素的位置，可以直接使用translate样式来实现。

参考下图：

如果帮助到了你，欢迎采纳，祝学习愉快。

0