CSS繼承的特性

  • 文章分類: 學CSS
  • 9/28/2010
text
text text text text

    說明

    將sample的背景設定為灰色，將文字設定為黃色，之後再將sample子階層裡的title文字設定為黑色，結果如上圖，由於sample子階層裡的body沒有任何設定，因此會繼承母階層的設定。
    • 母階層 Sample(背景灰、文字黃)
    • 子階層 title(背景灰、文字黑) 只設定了文字顏色因此只繼承母階層的背景
    • 子階層 body(背景灰、文字黃) 由於沒有任何設定所以繼承母階層的背景及文字

    CSS

    .sample {background:#ccc;color:#fff100}
.sample .title{color:#000}

    HTML

    <div class="sample ">
<div class="title">
<span>text</span>
</div>
<div class="body">
<span> text text text text </span>
</div>
</div>