武林網(www.survivalescaperooms.com)文章簡介：CSS樣式表中繼承關系的空格與不空格.

　　我們看過一些樣式表文件的樣式名都寫的很長，比如：body #header .topbar.logo{...}，這是因為利用了元素的繼承關系，利用元素名，或者ＩＤ名和類名（也就是class名）來精確定位和描述某一個區域的css樣式表格式。

　　初學樣式表的人肯定會說，我要精確定位一個區域的樣式表，用一個class名不就可以嗎，還需要這么麻煩嗎？這話說的沒錯，做只有幾個頁面的小網頁，也確實不用這么麻煩，但是當你規劃一個大型網站的時候，你就肯定要利用web元素的繼承關系，按照從大區域到小區域的次序來寫ＣＳＳ文檔。這就就象畫畫一樣，學過繪畫的朋友，都知道，畫素描都是先打型然后在鋪大色調，最后是深入刻畫。ＣＳＳ文檔也是，確定大區域的結構，然后在深入繼承和規劃。

　　好了，言歸正傳，今天要講的是ＣＳＳ樣式表中繼承關系的空格與不空格的問題。先看下面的一個例子：

這是我的ＣＳＳ文件：

<style type="text/css">
td .a{
color: #006600}
td.b{
color: #FF0000}
</style>

這是我的body元素里的代碼：

<table>
  <tr>
    <td class="b">
  <div>
        <ul class="a">
  <li>這里是標簽"li"</li>
  </ul>
        </div>

</td>

  </tr>
</table>

　　在ＣＳＳ文件里td后面跟著的class名是 a 和 b ,a里面我定義的字體顏色是綠色，b里面我定義的字體顏色是紅色．現在我要說的是，這兩個樣式表寫法都是正確的，類名b沒有空格連著元素<td>，而類名a有空格接著元素<td>，運行此代碼，你發現頁面顯示字體為綠色，這說明頁面讀取了樣式表td空格a的內容，由此我們可以推斷，頁面樣式表文件是按照頁面元素由里到外的次序來讀取的，取近舍遠的原則。

　　如果我們把樣式表td空格a的空格去掉，你會發現，現在頁面字體的顏色是讀取的樣式表b里的內容，字體變為紅色的了。這說明了不空格的樣式表寫法是針對在當前所在元素內而定的，(因為在頁面td元素代碼里我們只有寫class=b，而沒有a，所以a樣式表的內容將不在頁面中表現出來),而有空格的樣式表寫法是繼承了當前元素內某個元素而定，通過反復的幾次測試，繼承的層級至少是一個層級以上就可以了，具體沒有嚴格的規定。

　　相信看到這里，大家對樣式表空格與不空格的關系已經有了一點認識，希望在以后的學習中與大家共勉。如有不正之處，還望包涵，指點！我也只是在工作學習中領悟點認識與大家分享。高手請勿見笑。