CSS布局

在讲解CSS布局之前，我们需要提前知道一些知识，在CSS中，html中的标签元素大体被分为三种不同的类型：

块状元素 、 内联元素(又叫行内元素) 和 内联块状元素 。

常用的块状元素有：

、

、

... 、 、 、 、 、、 、

常用的内联元素有：

、 、
、 、 、 、 、 、 、 、

常用的 内联块状元素 有：

、

元素分类--块级元素

什么是块级元素？在html中

、

、

、 、 和 就是块级元素。设置 display:block 就是将元素显示为块级元素。如下代码就是将 内联元素a 转换为 块状元素 ，从而使a元素具有 块状元素 特点。

a{display:block;} 

块级元素特点：

1、每个块级元素都从新的一行开始，并且其后的元素也另起一行。（真霸道，一个块级元素独占一行）

2、元素的高度、宽度、行高以及顶和底边距都可设置。

3、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。

元素分类--内联元素

在html中， 、、 、 和 就是典型的 内联元素 （ 行内元素 ）（inline）元素。当然 块状元素 也可以通过代码 display:inline 将元素设置为 内联元素 。如下代码就是将 块状元素div 转换为 内联元素 ，从而使 div 元素具有 内联元素 特点。

 div{
     display:inline;
 }

......

我要变成内联元素

      
查看更多关于CSS布局的详细内容...
        

          
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://www.haodehen.cn/did101970