用DIV+CSS画九宫格的基本思路： 将九宫格看成是一组3x3的色块元素，一行3个元素，一共3行。 行内元素用 span， 行间用块级元素div实现换行的效果。核心html如下：

<div>

<span id="first"></span>

<span id="second"></span>

<span id="third"></span>

</div>

<div>

<span id="a21"></span>

<span id="a22"></span>

<span id="a23"></span>

</div>

<div>

<span id="a31"></span>

<span id="a32"></span>

<span id="a33"></span>

</div>

其中，每个span元素都加了id以便调试。

根据上述思路，每个span元素应表现为一个色块，故设置如下CSS：

div, span {

background-color: yellow; 

border: 2px;

width: 8em;

height: 8em;

padding: 1em, 1em, 1, 1;

margin: 2em;

}

然后结果表现不如预期，只有纵向排列的3个色块，没有出现9个。

为了调试，我给每个span元素加id，然后单独设置它们的颜色，结果不能生效。