风雨砥砺，岁月如歌--CSS基本概念初总结

什么是CSS？

    层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

    CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。

CSS的一些核心概念

    CSS的核心概念有四个：标准流、盒模型、position、float，它们是CSS的基础也是最常用的几个概念。

标准流

   标准流就是标签的排列方式，页面里显示的顺序和代码里的顺序一致就是符合标准流了。例如：

<h4>新闻分类</h4>
            <ul>
                <li><a href="#">首    页</a></li>
                <li><a href="#">体育新闻</a></li>
                <li><a href="#">财经新闻</a></li>
                <li><a href="#">社会新闻</a></li>  
            </ul>

但是如果给里边的某一个标签加上浮动或者定位属性，就可能会脱离标准流了。

盒子模型

     网页上的对象都可以看作一个盒子，设计师可以通过创建定义来控制这个盒子的属性。这些对象包括：段落、列表、标题、图片以及层<div>，而这个盒子就是盒子模型（Box Model）

   盒模型主要由4部分组成，从内到外分别是：content内容、padding填充、border边框、margin边界，一般来说整个盒子在页面中所占有宽度的计算是：

               总宽度=左边界+左边框+左填充+右填充+右边框+右边界

                

     但是不同浏览器对宽度的诠释不一样，所以要显示出它预期的效果要实际测量做好兼容工作。

.addcomment
{
    /*发表评论*/
    width:760px;
    margin-bottom:10px;
    text-align:center;
    border:1px solid #D6D7D6;
    background-color:#F7F7F7;
}

定位

     这个属性决定了元素是如何定位的，它的值主要有五种

     每个网页都可以看成是由一层层页面堆叠起来的，position 设置为relative 的时候，元素依然在普通流中，可以通过 left right 等移动元素。当position设为absolute的时候，相当于display为block。

浮动

    浮动就是把元素浮动，它的取值一共有四个：left、right 、none、inherit。浮动可以理解为让某个div元素脱离标准流，漂浮在标准流之上，和标准流不是一个层次。

    假如某个div元素A是浮动的，如果A元素上一个元素也是浮动的，那么A元素会跟随在上一个元素的后边(如果一行放不下这两个元素，那么A元素会被挤到下一行)；如果A元素上一个元素是标准流中的元素，那么A的相对垂直位置不会改变，也就是说A的顶部总是和上一个元素的底部对齐。

    div的顺序是HTML代码中div的顺序决定的。

    靠近页面边缘的一端是前，远离页面边缘的一端是后。

小结

刚刚接触，或许还有些不太理解，希望大家多批评指正哦。