CSS高级样式（上）

块级元素（block element）

<1> 每个块级元素默认占一行高度，一行内添加一个块级元素后无法一般无法添加其他元素（float浮动后除外）

<2> 两个块级元素连续编辑时，会在页面自动换行显示。块级元素一般可嵌套块级元素或行内元素

常见的块级元素

<1>div - 常用块级容易，也是css layout的主要标签

<2>div - dl - 定义列表

<3>div - h1 - h6 标题标签

<4>div - hr - 水平分隔线

<5>div - menu - 菜单列表

<6>div - ol - 排序表单

<7>div - p - 段落

<8>div - table - 表格

<9>div - ul - 非排序列表

<1> 也叫内联元素、内嵌元素等；行内元素一般都是基于语义级(semantic)的基本元素，只能容纳文本或其他内联元素，常见内联元素 “a”

常见的行内元素

<1>a - 锚点

<2>b - 粗体(不推荐)

<3>br - 换行

<4> em - 强调

<5> i - 斜体

<6>img - 图片

<7>input - 输入框

<8>label - 表格标签

<9>select - 项目选择

<10> span - 常用内联容器，定义文本内区块

<11>strong - 粗体强调

<12>sub - 下标

<13>sup - 上标

<14>textarea - 多行文本输入框

<15>u - 下划线

<1> 将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流 ;

<2> CSS的定位机制有3种：普通流、浮动和定位 ;

<3> 文档流：从上到下，从左到右，一个挨一个的简单或者叫正常布局 ;

<4> 定位：（position）

Static：保持文档流 ;

Relative：相对本身的原始位置发生位移且保持文档流，占空间 ;

Absolute：脱离文档流，不占空间且相对于其包含块来定位 ;

<5> 浮动：（flaot）脱离文档流，不占空间 ;

<6> 以前总是觉得position：static这个属性很多余，它的作用就是让元素保持文档流的;

可用参数

<1>none - 此元素不会被显示 ;

<2>block - 显示为块级元素，此元素前后会带有换行符 ;

<3>inline - 默认 , 此元素会被显示为内联元素，元素前后没有换行符 ;

属性概要

<1>overflow 属性规定当内容溢出元素框时发生的事情 ;

<2>这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要用户代理都会提供一种滚动机制 ;

<3>有可能即使元素框中可以放下所有内容也会出现滚动条 ;