示例代碼中的幾個小問題

任務四、設置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

關注問題我要回答

1261

操作

收起

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;}