web开发学习日志3-CSS
CSS简述
CSS (Cascading Style Sheets)，即层叠样式表，是一种标记语言（markup language）。用来描述网站上各种元素的外观，例如颜色、字体、间距、排版等等。它把内容和样式分开了，内容部分用HTML来写，样式部分用CSS来写。
CSS语句的基本结构
选择器（selector）+声明块（declaration block）
CSS语句基本结构(www.udacity.com)
- 选择器告诉浏览器我们要为哪些HTML元素设计样式
- 声明块告诉浏览器需要将哪些样式应用于该HTML
CSS选择器
选择器种类很多，主要包含如下四大类
- 基本选择器
- 组合选择器
- 伪类
- 伪元素
对于初学者，首先接触到的是基本选择器里的两种：
ID选择器
一个HTML元素只能拥有一个ID，并且这个ID只能在网页中使用一次。
HTML代码：
<div id="identified">Here's a span with some text.</div>
<div>Here's another.</div>
CSS代码：
#identified {
background-color: DodgerBlue;
}
类（class）选择器
如果要给多个HTML元素添加相同的属性，那就要用到类（class）。有点绕口的说法，类可以用在多个HTML元素，一个HTML元素也可以有多个类。因此类异常强大与灵活。
HTLM代码：
<div class="classy text">Here's a span with some text.</div>
<div>Here's another.</div>
CSS代码：
.classy {
background-color: DodgerBlue;
}
.text {
font-size: 16px;
}
两种选择器的表达方式
如果HTML元素应用了ID属性，先写#，后面紧跟相应ID的名字
#description {
color: blue;
}
如果应用了class属性，先写 . (圆点），后面紧跟相应class的名字
.paragraphs {
color: red;
}
CSS样式表
如果我们要在多个网页上使用同一个 CSS 该怎么办？可以将所有 CSS 从一个文件复制到另一个文件， 但工作量明显加大，如果后期需要修改CSS代码，同时要更改这个 CSS 的每一个副本。毫无疑问工作量成倍增加，而且容易出错。那么有没有简单的方法呢？答案是肯定的，我们可以把CSS代码写到名为样式表的文件中， 然后在 HTML 中加一行代码链接到该文件。
样式表是一个文件，它包含描述元素如何在网页上呈现的代码。这和你之前的操作没有区别，除了 CSS 存在于不同文件中而你不必再使用
<style>标签。要创建样式表，只需将新文件添加到项目， 写入某些 CSS，然后将其另存为 name-of-stylesheet.css。
如何链接一个样式表
在你的网页能够使用样式表之前，你需要先链接它。执行此操作，需要在 HTML 中创建一个指向样式表的 <link>。创建链接只需在 HTML 的 <head> 中键入以下内容。
<link href="path-to-stylesheet/stylesheet.css" rel="stylesheet">
href 属性指定所链接资源的路径，rel 属性指定资源和文档之间的 关系。这里的关系是样式表。完成之后如下所示:
<head>
<title>我的网页</title>
...
<link href="path-to-stylesheet/stylesheet.css" rel="stylesheet">
...
</head>
CSS参考
目前已知的CSS属性已经有上百个，而且数量还在不断增多，如此庞大的数量我们是无法全部记住的，在以下网站中搜索关键词，可以找到所需要使用的 CSS 属性：
