匿名框分为两种，一种是匿名块级框，另一种是匿名内联框。
匿名块级框
看下面的例子
<div> Some text <p>More text</p> </div>
上面的代码会生成一个匿名块级框来包围Some text文本。演示效果如图:
如果一个块级框(如上面的div),包含一个另一个块级框(如上面的p), 那么css强制这个块级框只包含块级框，因此会为Some text生成一个匿名块级框。
当一个行内框包含一个块框(block box)时，这个行内框 (inline box)（和与它处于同一行框内的祖先行内框）会围绕着块框被截断。断点之前和之后的行框(line boxes)会被封闭到匿名的框里，并且，这个块框会成为这些匿名框的兄弟框。当这样的行内框受到相对定位的影响时，相对定位也会影响块框。如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <HEAD> <TITLE>Anonymous text interrupted by a block</TITLE> <style type = "text/css"> p { display: inline; background: orange; } span { display: block; background: silver; margin: 10px; } </style> </HEAD> <BODY> <P> This is anonymous text before the SPAN. <SPAN>This is the content of SPAN.</SPAN> This is anonymous text after the SPAN. </P> </BODY>
运行结果:
p元素形成的行框被分割开，并且形成两个匿名行内框，这两个匿名行内框位于<span>形成的块框两侧，它们是兄弟框。当对p元素相对定位时，这三个块框会一起移动。
匿名行内框
任何直接存在于一个块级元素里面的文本(即文本没有被行内元素包裹)，都会被视为匿名行内元素，会生成一个匿名行内框包围它们。如下:
<p>Some <em>emphasize</em> text</p>
p元素生成的块级框里面只包含行内元素，文本"emphsize"的行内框是<em>标签形成的，因此不是匿名框，而文本"Some"和"text"没有相应的标签包裹它们，因此包围它们的就是匿名行内框。
这些行内框从父元素那里继承可以继承的属性，那些不能继承的属性就用初始化值。
空白字符会根据white-space属性被压缩，因此不会生成任何行内框