CSS是什么？
CSS是一个名称，是一个功能，用于对HTML文件功能的补充及扩展。其作用就是对HTML文件中各种排版进行设置，达到对网页中字体、颜色、背景、图片等的控制，使网页能够完全依照设计者的想法来显示。
为什么要有CSS？
CSS可以控制网页的显示，HTML标签中的属性也可以控制其显示，为什么还要有CSS呢？其中一个原因如下描述，以前几乎一个人就可以完成一个网站的设置，非常的简单，现在不是了，一个网站需要很多的人一起工作才可以完成，如果每个人都按照自己的喜好制作网页，那么开发出来的网页的风格就会不一样，那么这些网页很难放在同一个网站中了，CSS可以方便地设置所有网页的风格，然后交友不同部门、不同地方的人制作网页。
CSS就是HTML中标签属性独立出来的东西，当然CSS也有自己特有的东西。将HTML语言中内容显示的部分独立的形成一个整体(CSS)，然后，我们编写网页的时候，使用HTML语言设置网页内容的结构，使用CSS语言设置网页内容的显示，从而达到使网页编程的灵活性和复用性增强的目的。注意，HTML语言仍具有网页内容显示的功能，但是，我们在具体做网页的时候，通常只用它对网页内容结构控制的功能。
怎么使用CSS？
CSS不同于JavaScript，CSS不能单独的存在，必须依靠HTML中的“标签”而存在，“标签”即CSS中的选择器，CSS样式表的基本语法结构为：选择器{属性一：值一；属性二：值二；……}；选择器可以为HTML标签名称，也可以是标签的属性id值，或class值。
HTML使用CSS有四种方式：行内样式、内嵌式、导入式和连接式。行内样式和内嵌式的CSS代码都存放在HTML文档里，导入式和连接式的CSS代码存放在单独的文件中。
<html>
<head>
<title>页面标题</title>
<!--内嵌式-->
<style type="text/css">
<!--
@import url(2.css); /*导入式*/
/*HTML标签名作为选择器*/
p{
color:#FF00FF;
}
/*HTML的class属性值作为选择器*/
.first{
background-color:#00FF00; /*设置背景颜色*/
}
/*HTML的id属性值作为选择器*/
#second{
background-color:#0000FF; /*设置背景颜色*/
}
-->
</style>
<!--链接式-->
<link href="1.css" type="text/css" rel="stylesheet">
</head>
<body>
<p style="color:#FF0000; font-size:20px; text-decoration:underline;">行内式</p>
<h1 class="first">标题一</h1>
<h2 id="second">标题二</h2>
</body>
</html>
为什么是CSS+DIV？
DIV是HTML中的块标记，就是把一些HTML标签作为一个块。CSS可以通过DIV标签，使被操作的对象的颗粒度可以灵活的改变。span标签是行内标签，div可以通过设置达到span的效果，但是，span很难达到div的一些效果。
盒子模型
HTML中的所有元素，不论其元素是块级元素，还是行集元素，在CSS看来都是一个盒子，这个就是盒子模型。这里需要说的是，我们最好把这个“盒子”理解成没有高度的盒子，这样有利于我们理解下面层的概念，当然，你也可以把这个“盒子”理解成有高度的盒子，这样的话，我们需要将下面“层”理解成有一定高度的层。具体的盒子模型如下
块级元素和行集元素
块级元素在标准文档流中是单独的占一行的，而行集元素在标准文档流中占得是行的一部分。但是当他们完全脱离标准文档流的时候，他们就不再具有该特性。块级元素和行集元素之间是可以相互改变的，通过display属性，当属性值为block时，就可以转换为块级元素，当属性属性值为inline时，就可以转换为行集(内联)元素。
层的概念
HTML文档内容的布局和显示不仅仅在一个平面上，而是可以在多个平面上进行布局和显示，各个平面（层）之间的布局有的并没有完全的断离关系，有的就完全脱离了关系，当然，其显示效果我们可以通过z-index属性进行设置，最后我们从最外的那个层面看到的重叠效果就是最终显示的效果。
文档流
在这里我们不需要太多的关心文档的输入流，应该多了解些文档的输出流，因为程序进程输出各个层的先后顺序的不同，就会导致最终我们看到层的重叠效果的不同。
根据文档流对层的一些控制的不同，我们可以把文档流分为常规流、绝对定位流和浮动流。现在我们可以把这个流当成层的意思。
常规流：最原始的那一层，最初该层包含所有的元素，其它层的元素都是从这个层里面弄走的，当然，弄走人家的东西，你得给人家一个说法；绝对定位流：该层弄走原始层元素时，给人家说，我弄走的东西就完全是我的了，以后你这关于它的任何东西都不能存在；浮动流：该层还算厚道，不像绝对定位流那样，说弄走人家东西，就连个毛也不给人家留，浮动流在弄走人家东西的时候，会告诉常规层，你们可以给它留个墓地或者把它原来的家留着，要是留墓地（够它住就行）的话，墓地的位置由我来定，“好处”就是它的真身会在墓地的上方，要是留它原来的家的话，它的真身可以任意的漂流，具体你们留墓地还是流家，会告诉你们的。
注意：行集元素作为盒子被使用的时候，其本质还是在常规流上，但该元素的上方会形成一个突起，这样我们从上方看的时候会出现一些覆盖的现象；块集元素作为盒子被使用的时候，它作用于整体，不会出现什么突起，什么覆盖的现象发生。绝对定位流和浮动流，是在重新定位元素位置（float和position属性设置）的时候出现的。
872
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
