CSS样式的学习(一)

在HTML中，虽然它内部定义了各种现成的文本、按钮、排版，但光使用这些现成的标签往往不能满足我们想要的页面效果，这时候就需要引入CSS样式，来改变原有标签的属性。

一、CSS简介

CSS (Cascading Style Sheets) 层叠样式表，是一个用于修饰文档（可以是标记语言HTML，也可以是XML）的语言，可以将文档以更优雅的形式呈现给用户。

二、CSS工作原理

当一个浏览器在显示文档的时候，需要将文档内容和样式内容结合到一起，以此，在处理文档的时候包含两个阶段：
1.浏览器首先会加载解析HTML文件内容，接着加载解析CSS文件内容，然 后创建一颗DOM树，将加载解析好的HTML和CSS文件内容存入DOM树中。
2.浏览器显示DOM的内容。

三、第一个CSS代码

首先我们可以在一个空文件夹中新建一个文件simple.css

在写CSS代码时，首先要写一个选择器，选择你希望改变它样式的标签或者是自己定义的选择器，这里以最简单的div为例，如下图就是一个简单的CSS代码，div是HTML中最常见的标签之一，它可以作为选择器，而写在div{}里的CSS内容，会修改div原本的样式。

在写CSS声明块时要注意首先使用中括号｛｝把所写的内容包裹起来，属性名(background-color)和属性值(red)之间要使用冒号(:)隔开，写完一个属性后，使用分号(;)与下一个属性隔开，最后一个属性声明完后可以不写分号，但这里笔者还是建议每声明完一个属性后都写上分号。

四、将CSS代码作用于HTML上

写完了CSS代码，但我们应该如何将CSS代码作用于HTML上呢？在刚刚的文件夹目录下新建一个1.html文件。

在标签< head >内部写上如图所示的代码，href中为你CSS代码的文件名字
总体代码如下，一个简单的CSS样式就写好了

在页面中的显示效果为