CSS核心内容-标准流、盒子模型、浮动、定位

    CSS核心内容-标准流、盒子模型、浮动、定位，了解了核心内容才能用CSS设计出一个简单的页面

 一、基础

    在了解核心内容之前需要先了解HTML中的两种标签：块级元素，行内元素；

    块级元素：一个块级元素占满一行

    行内元素：在一行中行内元素依次填充

    在CSS中可以将行内元素转换为块级元素，通过的是Display属性来实现的

    有了以上的基础后再看核心内容

 二、核心

    1.标准流

        标准流就是在CSS中默认的块级元素和行内元素的排列方法

        标准流是默认的排列方法，那么我们也可通过代码来改变它的默认值(即float浮动)

    2.盒子模型

	基本元素：外边距，内边距，边框，内容四部分

	要注意的是：盒子模型针对的是块级元素，某些样式对行内元素无用

#content{ background-color :#eff7ff; /*背景颜色*/ border:1px solid #428eff; /*边框*/ width:70px; /*宽度*/ height:25px; /*高度*/ display:block; /*转换为块级元素*/ font-size:12px; /*字体*/ text-align:center; /*位置*/ line-height :25px; /*高度*/ margin-left:20px; /*外左边距*/ color:#0059bd; /*字体颜色*/ text-decoration:none; /**/ }

	 以上是对盒子模型的一些属性的设置

    3.浮动

	对于设置了浮动的框，那么它就不再属于标准流，所以它的排列方式也会有所不同

	通过对文本框的设置浮动，可以排版框的位置，通过设置框向左或向右浮动的位置，直到碰到包含框

      或另一个浮动框的边缘为止

#Style｛ float:right; ｝

	以上就是设置框样式的向右浮动

	取消浮动可以用Clear来实现

#Style｛ float：Clear； ｝

    4.定位

	主要分为两种：绝对定位和相对定位

	相对定位脱离了标准流，以他所在标签的第一个标准流父标签为基准

#style { display:block; position:absolute; /*绝对定位，可以放置在页面的任何位置*/ position:relative; /*相对于其原来的位置的移动距离*/ }

	还有一种定位方式是固定定位，是相对于其他某一元素来进行定位，应该算是相对定位的一种，都是

     其相对位置的改变

 三、小结

     以上就是对CSS核心内容的整体的了解，而且这些内容是学习CSS的基础，通过基础的学习，在以后的学

   习过程中，遇到问题解决问题，从而获得更大的提高。

     学习不是一蹴而就的事情，有了理论的学习，还要进行一些实践，就比如上边写的内容，说起来大家都懂

   但是真正做起来就会体现出差距来，所以还是要多动手实践。。