html 三大元素基本了解

顶级元素

包括 html body frameset

内敛（inline）

特点：内联元素高度宽度不可以设置  不会独占一行 依附于块级元素存在

不会换行  不过可以通过 css的display 的inline和float来实现其块级元素

任何不是块级元素的可见元素都是内联元素  例： em  img  a  br  li 等 内联元素是 行布局 意思就是 一行的形式进行输出  实验

记过可以证明内敛元素是行布局

块级元素（block）

块级元素是块状 不是按照行显示  块状元素可以再页面的任意位置  块状元素一般容纳其他元素和内联元素

常见的有  p 。 其中 from这个标签比较特殊  只能用来容纳其它标签。

table 标签也是块级标签  。。。。。

块级元素与行内元素最大区别是 块级元素总是新起一行  不过css的使用让两者的差异变小 不在那么死板内联元素通过 display：block；每次都是从新行开始。

文档流

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

每个非浮动块级元素都独占一行, 浮动元素则按规定浮在行的一端. 若当前行容不

下, 则另起新行再浮动.

内联元素也不会独占一行. 几乎所有元素(包括块级,内联和列表元素)均可生成子

行, 用于摆放子元素.

有三种情况将使得元素脱离文档流而存在,分别是浮动,绝对定位, 固定定位. 但是在

IE中浮动元素也存在于文档流中(还让我觉得这样很合理><).

浮动元素不占任何正常文档流空间，而浮动元素的定位还是基于正常的文档流，然后从

文档流中抽出并尽可能远的移动至左侧或者右侧。文字内容会围绕在浮动元素周围。当

一个元素从正常文档流中抽出后，仍然在文档流中的其他元素将忽略该元素并填补他原

先的空间。

问题  display：inline；可以解决什么问题？？

块级元素：* address - 地址

* blockquote - 块引用

* center - 举中对齐块

* dir - 目录列表

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

* dl - 定义列表

* fieldset - form控制组

* form - 交互表单

* h1 - 大标题

* h2 - 副标题

* h3 - 3级标题

* h4 - 4级标题

* h5 - 5级标题

* h6 - 6级标题

* hr - 水平分隔线

* isindex - input prompt

* menu - 菜单列表

* noframes - frames可选内容，（对于不支持frame的浏览器显示此区块内容

* noscript - 可选脚本内容（对于不支持script的浏览器显示此内容）

* ol - 排序表单

* p - 段落

* pre - 格式化文本

* table - 表格

* ul - 非排序列表

内联元素

* a - 锚点

* abbr - 缩写

* acronym - 首字

* b - 粗体(不推荐)

* bdo - bidi override

* big - 大字体

* br - 换行

* cite - 引用

* code - 计算机代码(在引用源码的时候需要)

* dfn - 定义字段

* em - 强调

* font - 字体设定(不推荐)

* i - 斜体

* img - 图片

* input - 输入框

* kbd - 定义键盘文本

* label - 表格标签

* q - 短引用

* s - 中划线(不推荐)

* samp - 定义范例计算机代码

* select - 项目选择

* small - 小字体文本

* span - 常用内联容器，定义文本内区块

* strike - 中划线

* strong - 粗体强调

* sub - 下标

* sup - 上标

* textarea - 多行文本输入框

* tt - 电传文本

* u - 下划线

* var - 定义变量

可变元素

可变元素为根据上下文语境决定该元素为块元素或者内联元素。

* applet - java applet

* button - 按钮

* del - 删除文本

* iframe - inline frame

* ins - 插入的文本

* map - 图片区块(map)

* object - object对象

* script - 客户端脚本