CSS中的嵌套规则，以及块级元素、内联元素、可变元素

嵌套规则：任何不是块级元素的可见元素都是内联元素

1. 块级元素可以包含内联元素和某些块级元素，但内联元素只能包含其他内联元素
2. 块级元素不能放在<p>里面
3. 有几个特殊的块级元素只能包含内联元素：h1~h6, p, dt
4. li内可以包含div
5. 块级元素与块级元素并列，内联元素与内联元素并列

---

来自：HTML中块级元素和行内元素的总结和区分

块级元素和行内元素的定义：

块级元素

• 总是在新行上开始；
• 高度，行高以及外边距和内边距都可控制；
• 宽度缺省是它的容器的100%，除非设定一个宽度。
• 它可以容纳内联元素和其他块元素

行内元素

• 和其他元素都在一行上；
• 高，行高及外边距和内边距不可改变；
• 宽度就是它的文字或图片的宽度，不可改变
• 内联元素只能容纳文本或者其他内联元素

对行内元素，需要注意如下：

• 设置宽度width 无效。
• 设置高度height 无效，可以通过line-height来设置。
• 设置margin 只有左右margin有效，上下无效。
• 设置padding 只有左右padding有效，上下则无效。注意元素范围是增大了，但是对元素周围的内容是没影响的。
• 通过display属性对行内元素和块级元素进行切换(主要看第2.3.4个值)：

块级元素：

<address>、<article>、<aside>、<audio>、<blockquote>、<canvas>、<caption>、
<dd>、<div>、<dl>、<dt>、<details>、<fieldset>、<figcaption>、<figure>、
<footer>、<form>、<h1> to <h6>、<header>、<hr>、<legend>、<li>、<menu>、
<meter>、<nav>、<noframes>、<noscript>、<ol>、<output>、<p>、<pre>、
<section>、<table>、<tbody>、<td>、<tfoot>、<th>、<thead>、<time>、<tr>、<ul>

行内元素：

<a>、<abbr>、<acronym>、<b>、<bdo>、<big>、<br>、<button>、<cite>、
<code>、<command>、<dfn>、<del>、<em>、<embed>、<i>、<img>、
<input>、<kbd>、<label>、<map>、<mark>、<objec>、<progress>、<q>、
<samp>、<select>、<small>、<span>、<strong>、<sub>、<sup>、
<textarea>、<time>、<tt>、<var>、<video>、<wbr>

来自：CSS中的块级元素、内联元素（行内元素）
可变元素：

可变元素为根据上下文语境决定该元素为块元素或者内联元素。
* applet - java applet
* button - 按钮
* del - 删除文本
* iframe - inline frame
* ins - 插入的文本
* map - 图片区块(map)
* object - object对象
* script - 客户端脚本