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>的 void element 去链接。

的参数

详细介绍

• 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">

2.Creating a class selector:,;like this:

p.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.