示例代码中的几个小问题

任务四、设置3D舞台布景过渡效果，这个任务的代码是不是一直没有触发过，所以不写也没事吧？
.nav-menu｛display: block;｝这是ul的类名，ul本来就是块元素，这里写这个是什么作用呢？
.nav-menu > li {display: inline;float:left;｝ li是块元素，这里设成内联元素的作用是什么？因为接下来就设置了float：left，所以感觉前面这句没用啊？
.three-d:not(.active):hover {cursor: pointer;} 这句代码也是无用的吧？a元素不本来就是手指样式吗？难道是为了更改老系统的样式？
.front, .back{pointer-events: none;｝这里为什么也要取消成为鼠标事件的target，作用是什么？不写的话会怎么样？
box-sizing: border-box;是什么意思？
.nav-menu ul{left: -40px;} 为什么要让下拉列表往左移动40px？

示例代码课程告诉了，案例在线演示地址：http://codepen.io/airen/pen/icFba

麓鹿不迷路

2018-06-10

源自：十天精通CSS3 9-10

关注问题我要回答

1190

操作

收起

2 回答

麓鹿不迷路提问者
2018-06-10

第六个问题已解决：box-sizing: border-box;作用是，一般来说设置宽高以后，再设置padding和boder时content大小不变，会往外扩，这样就可能会挤到周围的元素，加上这句代码以后，宽高设置好就不变了，padding和border会往里设置，对应的content区域会减小。

1 回复有任何疑惑可以回复我~

收起回答

麓鹿不迷路提问者
2018-06-10

第七个问题已解决：原因是ul标签默认左边有40px的值。

在FireFox中是padding值(即：padding-left:40px),而在IE中是margin值（即：margin-left:40px）,所以先定义 *{margin:0;padding:0;}就能解决大部分问题，但据说比较占资源。
一般都在总样式规定一下：body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,img {padding:0;margin:0;}