Getting started with CSS

前言

CSS 的 rule

作者做了一個非常形象的比喻，將 CSS 必做 renovate the house，在這裡，CSS 包括了三個部分：

1. Selector:the location of the HTML element
2. Property:properties in that location
3. Style:like black, or 1px...

適配 style 的第二種方式：

第一種：在 HTML 中的 head 裡面新增 <style>element
第二種：建立一個 CSS file，這個 CSS file 還有一個名字叫做 stylesheet,然後在 HTML 中用一個叫做<link>

的引數

詳細介紹

• type 在 HTML5 是 optional 的了，可加也可以不加。
• rel 引數是用來表示 relationship between HTML file and the linked file,這裡連結的是 HTML 的stylesheet,
• href 的引數的 value 為 relative path 或者 URL.

對每個element 新增不同的效果

通過 class 可以做到這一點，操作方法為兩個步驟：
1.In HTML,adding class attribute to and element,like:
<p class="greentea">

其他知識

• 當兩個 element 有相同的 presentation 的時候，可以用 h1,h2 這樣的方式。
• bordor-bottom 這個 style 和 underline 是不同的，border-bottom很長。
• 當存在兩個對於同一個 element 的 style 的時候，選取 more specific 的那個，也就是說：如果有h1,就不選 body 樣式，如果有.classname 這樣的標示，就不選 h1。
• 在 HTML 中，一個 element 可以屬於多個 class，比如可以是：<p class="blueberry greentea raspberry>
  ,在應用的時候，同樣是應用 more specific 的那一個，當同一等級的時候，會應用 stylesheet 中的 last 的那個style。
• 有一個 property ，比如說font，是具有inheritance 的特性的，但是有的就沒有，比如border，區分這一點可以用 common-sense，比如說：border 加在 body 上，不會加在每一個 p 上。
• 選擇字型的時候用的 property 的名字叫 font-family，現在介紹了 serif 和 sans-serif.
• 可以在 CSS 裡面添加註釋，格式為：/**/
• 在分析 heritance 的時候，就像是 child 遺傳 parent 的格式，如果 parent 被設定了更加具體的 style ，那麼它的 children 就不會 inherit 那個比 parent 還大的parent 的style.