想象一下這是三層紙疊在一起，最下面是橙色的div，中間是透明的span，最上面是透明的input，當選項選中時，span透明度變成1，就可見了，他們的堆疊順序其實還是不變的

因為 input和span 都定義了position：absolute;即：脫離文本文檔流，浮動了起來（飄起來了）在垂直方向上span 在input上邊,所以你點擊方框的時候點到的是span ，為了能點到input 就把 input的垂直坐標定義為100（z-index:100）,span的垂直坐標定義為1(z-index:1)，這樣點擊方框的時候就能點擊到input標簽里面的復選框了.

不知道我解釋的明不明白？

span是沒有點擊功能的，除非用js或者jq給他添加一個點擊事件，input的radio屬性是有點擊功能的，所以 input在span上一層點擊之后，span的白色圓圈就會顯示出來

一開始我是這么理解的：就是span上邊一層有一個透明的按鈕 這樣就不會因為點到span的位置按鈕被擋住

但是我看了這個之后http://www.w3cplus.com/css/what-no-one-told-you-about-z-index.html

在看這個徹底懵逼了