首先，來張大圖：
上邊這張黃黃的，大大的，圓圓的，有個小尾巴，文字內(nèi)容有些YY的圖片，就是使用純CSS實現(xiàn)的氣泡對話框效果，一點圖片都沒有哦。看到這里，你是不是跟我一樣，有些驚嘆CSS的潛力呢。關(guān)于這張圖片，暫時先放到一邊，下面我要講一些與主旨相關(guān)的比較重要的，同時又很實用的一些技術(shù)。
我們首先看下面這一張圖片（截自人人網(wǎng)）：
可能顏色有點淡，在左上角有個90度的尖角，于是整個形成了一個氣泡對話框。現(xiàn)在考考你，如果你來實現(xiàn)這個效果，你會怎么做？//zxx:假設(shè)你已經(jīng)思考了一會兒｡◕‿◕｡ 我想，如果您沒有看本文標題，可能就想到的是做個90度等腰三角形小圖片；就算您知道可以用CSS實現(xiàn)上面的效果，但是您知道是什么方法嗎？當(dāng)然，是絕對兼容的方法（從已經(jīng)在美國辦了隆重葬禮的IE6到很多人喜歡的Firefox和Safari）。您有主意嗎？
好，我們先來看看人人網(wǎng)是怎么實現(xiàn)的，我們用小bug（//zxx:指firebug，我喜歡親切的稱之為“小bug”）看一看，原來也是使用的圖片，600*6像素的圖片，見下圖：
查看此圖片點此鏈接：http://xnimg.cn/imgpro/box/box_arrow.png
這可是活生生的多了一次圖片請求啊，而且是個獨立的小圖片，關(guān)鍵是在訪問量驚人的首頁上。優(yōu)秀與平庸的差異在哪里呢？前者追求極致，后者追隨大流。
這里的圖片完全沒有必要，使用CSS可以實現(xiàn)近乎一樣的效果，并且方法不止一種，我目前知道的有兩種方法可以實現(xiàn)上面人人網(wǎng)的氣泡對話框效果。我將這兩個方法自己定義為“邊框法”與“字符法”。
二、“字符法”與“邊框法”1. 字符法
關(guān)于“字符法”，其實在我的“告別圖片—使用字符實現(xiàn)兼容性的圓角尖角效果beta版”一文中已經(jīng)比較詳盡的提及過。
這里再簡單講述下，世界上的語言多種多樣，字符的種類也是千差萬別，形狀也是千奇百怪，所以，有些字符就可以當(dāng)作圖形來使用，以模擬一些web表現(xiàn)效果。例如，上面的人人網(wǎng)對話框尖角就可以使用棱形字符(◆)來實現(xiàn)，看到這個形狀上面的90度的尖角了嗎，我們可以讓其溢出div顯示，不就有了尖角效果了嗎！定位可以使用margin負值或是absolute絕對定位。
在我的網(wǎng)站上就應(yīng)用了這個方法，您可以在網(wǎng)站的“提問與交流”頁面看到類似下圖所示的內(nèi)容：
具體使用，您可以狠狠地點擊這里：“字符法”實現(xiàn)氣泡對話框demo
里面顯示了CSS與HTML代碼。
2. 邊框法
關(guān)于“邊框法”，這說起來話就長了。不急，慢慢來。
我們首先來看下面一段樣式代碼：
新聞熱點
疑難解答
