問題：如何可以調(diào)出動(dòng)易圖片文章顯示這樣的效果？
則：#index {}
#index td {中間該是什么ＣＳＳ}

解答：
#index td { background: url(/images/indeximg.gif) repeat-x bottom; line-height: 24px;} /* id為index的div區(qū)塊中，td單元格中的背景圖片橫向重復(fù)，可以進(jìn)一步定義行高與高度 */
#index img { border: #064D9F 1px solid;margin-bottom:5px;} /* id為index的div區(qū)塊中，所有圖片的邊框?yàn)橐粋�(gè)像素寬藍(lán)色實(shí)線；并距下面5個(gè)像素的空距 */
#index a, #index a:link, #index a:visited, #index a:active {color:#fff;text-decoration: underline;} /* id為index的div區(qū)塊中，有鏈接文字的三種狀態(tài)的文字顏色為白色 */
#index a:hover {color:#ffff00;text-decoration: underline;} /* id為index的div區(qū)塊中，鼠標(biāo)經(jīng)過時(shí)文字的三種狀態(tài)的文字顏色為白色 */

說明：因?yàn)槎�義了#index td后會(huì)將所有的單元格填上顏色，因此很難達(dá)到與圖片間有間距的效果。因此用背景橫向重復(fù)（repeat-x表示只橫向重復(fù)圖片不豎向重復(fù)）、居于底部（bottom）的方法（因?yàn)橄到y(tǒng)是以<br>回行的方式分開圖片與文字的，所以要用bottom使圖片居于底部）�？梢越鉀Q在圖片距下面5個(gè)像素的空距（margin-bottom:5px;）后呈現(xiàn)白色的效果。圖片只要做寬為1、高為單元格高度的藍(lán)色背景的小小的圖片即可。

#index img定義了id為index的div區(qū)塊中圖片的樣式，圖片距下面5個(gè)像素的空距（margin-bottom:5px;）。

此處有鏈接的文字必須使用#index a的方式，才能指定id為index的div區(qū)塊中有鏈接文字的顏色。您也可以在此進(jìn)一步定義字體、字號(hào)、大小。定義了大一些的字體，要配合修改如#index td 中的行高定義（ line-height: 24px;）和圖片定義，這里不再重復(fù)。

希望大家能加強(qiáng)對(duì)div中控制css樣式使用的測(cè)試，會(huì)給您在相應(yīng)制作中帶來一定的啟示。

附：

indeximg.gif

效果請(qǐng)參閱：/help/Index.html
<div id="index"><!--{$GetPicArticle(1004,27,True,0,2,false,false,0,3,2,130,80,36,0,True,1)}--></div>
</td>

以上效果風(fēng)格代碼：

#index td { background: url(/images/indeximg.gif) repeat-x bottom; line-height: 24px;} /* id為index的div區(qū)塊中，td單元格中的背景圖片橫向重復(fù)，可以進(jìn)一步定義行高與高度 */
#index img { border: #064D9F 1px solid;margin-bottom:5px;} /* id為index的div區(qū)塊中，所有圖片的邊框?yàn)橐粋�(gè)像素寬藍(lán)色實(shí)線；并距下面10個(gè)像素的空距 */
#index a, #index a:link, #index a:visited, #index a:active {color:#fff;text-decoration: underline;} /* id為index的div區(qū)塊中，有鏈接文字的三種狀態(tài)的文字顏色為白色 */
#index a:hover {color:#ffff00;text-decoration: underline;} /* id為index的div區(qū)塊中，鼠標(biāo)經(jīng)過時(shí)文字的三種狀態(tài)的文字顏色為白色 */

以上效果頁面源代碼：

查看更多 動(dòng)易Cms教程  動(dòng)易Cms模板