效果图：
首先看个简单的例子吧。
代码如下：[点击运行，可预览效果] <BR><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<A href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" data-cke-saved-href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" data-cke-saved-href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</A>"><BR><cke:html xmlns="<A href="http://www.w3.org/1999/xhtml" data-cke-saved-href="http://www.w3.org/1999/xhtml" data-cke-saved-href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</A>"><BR><cke:head><BR><cke:encoded>%3Cmeta%20http-equiv%3D%22Content-Type%22%20content%3D%22text%2Fhtml%3B%20charset%3Dgb2312%22%20%2F%3E</cke:encoded><BR><cke:title>http://www.cssrain.cn</cke:title><BR><cke:encoded>%3Cstyle%3E%3CBR%3E*%7B%20margin%3A0%3B%20padding%3A0%3B%7D%3CBR%3Ebody%7B%20margin%3A0%20auto%3B%20font-size%3A12px%3B%7D%3CBR%3E.model%7Bmargin%3A0%20auto%3B%20width%3A30px%3B%7D%3CBR%3E.model%20a%3Ahover%7B%20text-decoration%3Anone%3B%7D%3CBR%3E.model%20a%20img%7B%20border%3A%23fff%201px%20solid%3B%7D%3CBR%3E.model%20a%3Ahover%20img%7B%20border%3A%23888%201px%20dotted%3B%7D%3CBR%3E.model%20a%20span%7B%20padding%3A0%3B%20display%3Ablock%3B%20width%3A80px%3B%20height%3A50px%3B%20margin-top%3A-32px%3B%20overflow%3Ahidden%3B%20line-height%3A14px%3B%20filter%3A%20Alpha(opacity%3D0)%3B%20opacity%3A.0%3B%20cursor%3Apointer%3B%20text-align%3Acenter%3B%7D%3C%2FP%3E%0A%3CP%3E%3CBR%3E%3C%2Fstyle%3E%3CBR%3E%3C%2Fhead%3E%3CBR%3E%3Cbody%3E%3CBR%3E%3Cdiv%20class%3D%22model%22%3E%3Ca%20href%3D%22%23%22%20data-cke-saved-href%3D%22%23%22%3E%3Cimg%20src%3D%22%3CA%20href%3D%22%20data-cke-saved-src%3D%22%3CA%20href%3D%22http%3A%2F%2Fwww.cnwebshow.com%2Fuploadfile%2Fedu%2Fuploadfile%2F200807%2F20080715104616471.jpg%22%3E%2Fuploadfile%2Fedu%2Fuploadfile%2F200807%2F20080715104616471.jpg%3C%2FA%3E%22%20border%3D%220%22%20%2F%3E%3C%2Fa%3E%3C%2Fdiv%3E%3CBR%3E%3Cdiv%20class%3D%22model%22%3E%3Ca%20href%3D%22%23%22%20data-cke-saved-href%3D%22%23%22%3E%3Cimg%20src%3D%22%3CA%20href%3D%22%20data-cke-saved-src%3D%22%3CA%20href%3D%22http%3A%2F%2Fwww.cnwebshow.com%2Fuploadfile%2Fedu%2Fuploadfile%2F200807%2F20080715104617773.jpg%22%3E%2Fuploadfile%2Fedu%2Fuploadfile%2F200807%2F20080715104617773.jpg%3C%2FA%3E%22%20border%3D%220%22%20%2F%3E%3C%2Fa%3E%3C%2Fdiv%3E%3CBR%3E%3C%2Fbody%3E%3CBR%3E%3C%2Fhtml%3E%3CBR%3E%3CBR%3E%3C%2FTEXTAREA%3E%20%3CBR%3E%3CINPUT%20id%3D0%20onclick%3DrunCode(this.id)%20type%3Dbutton%20value%3D%E8%BF%90%E8%A1%8C%E4%BB%A3%E7%A0%81%3E%26nbsp%3B%26nbsp%3B%20%3CINPUT%20id%3D0%20onclick%3DdoCopy(this.id)%20type%3Dbutton%20value%3D%E5%A4%8D%E5%88%B6%E4%BB%A3%E7%A0%81%3E%20%26nbsp%3B%26nbsp%3B%20%3CINPUT%20id%3D0%20onclick%3DsaveCode(runcode0)%20type%3Dbutton%20value%3D%E4%BF%9D%E5%AD%98%E4%BB%A3%E7%A0%81%3E%20%26nbsp%3B%26nbsp%3B%3CBR%3E%5BCtrl%2BA%20%E5%85%A8%E9%83%A8%E9%80%89%E6%8B%A9%20%E6%8F%90%E7%A4%BA%EF%BC%9A%E4%BD%A0%E5%8F%AF%E5%85%88%E4%BF%AE%E6%94%B9%E9%83%A8%E5%88%86%E4%BB%A3%E7%A0%81%EF%BC%8C%E5%86%8D%E6%8C%89%E8%BF%90%E8%A1%8C%5D%3C%2FP%3E%0A%3CP%3E%3Cbr%3E%E5%A5%BD%E4%BA%86%EF%BC%8C%E7%9C%8B%E6%9C%80%E7%BB%88%E6%95%88%E6%9E%9C%3Cbr%3E%3C%2FP%3E%0A%3CP%3E%E4%BB%A3%E7%A0%81%E5%A6%82%E4%B8%8B%EF%BC%9A%5B%E7%82%B9%E5%87%BB%E8%BF%90%E8%A1%8C%EF%BC%8C%E5%8F%AF%E9%A2%84%E8%A7%88%E6%95%88%E6%9E%9C%5D%3CBR%3E%3Cbr%3E%3Cbr%3E%3CBR%3E%3CTEXTAREA%20id%3Druncode0%20rows%3D9%20cols%3D72%3E%3CBR%3E%3CBR%3E%3C!DOCTYPE%20html%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20XHTML%201.0%20Transitional%2F%2FEN%22%20%22%3CA%20href%3D%22http%3A%2F%2Fwww.w3.org%2FTR%2Fxhtml1%2FDTD%2Fxhtml1-transitional.dtd%22%20data-cke-saved-href%3D%22http%3A%2F%2Fwww.w3.org%2FTR%2Fxhtml1%2FDTD%2Fxhtml1-transitional.dtd%22%3Ehttp%3A%2F%2Fwww.w3.org%2FTR%2Fxhtml1%2FDTD%2Fxhtml1-transitional.dtd%3C%2FA%3E%22%3E%3CBR%3E%3Chtml%20xmlns%3D%22%3CA%20href%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%22%20data-cke-saved-href%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%22%3Ehttp%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%3C%2FA%3E%22%3E%3CBR%3E%3Chead%3E%3CBR%3E%3Cmeta%20http-equiv%3D%22Content-Type%22%20content%3D%22text%2Fhtml%3B%20charset%3Dgb2312%22%20%2F%3E%3CBR%3E%3Ctitle%3Ehttp%3A%2F%2Fwww.cssrain.cn%3C%2Ftitle%3E%3CBR%3E%3Cstyle%3E%3CBR%3E*%7B%20margin%3A0%3B%20padding%3A0%3B%7D%3CBR%3Ebody%7B%20margin%3A0%20auto%3B%20font-size%3A12px%3B%7D%3CBR%3E.model%7Bmargin%3A0%20auto%3B%20width%3A30px%3B%7D%3CBR%3E.model%20a%3Ahover%7B%20text-decoration%3Anone%3B%7D%3CBR%3E.model%20a%20img%7B%20border%3A%23fff%201px%20solid%3B%7D%3CBR%3E.model%20a%3Ahover%20img%7B%20border%3A%23888%201px%20dotted%3B%7D%3CBR%3E.model%20a%20span%7B%20padding%3A0%3B%20display%3Ablock%3B%20width%3A80px%3B%20height%3A50px%3B%20margin-top%3A-32px%3B%20overflow%3Ahidden%3B%20line-height%3A14px%3B%20filter%3A%20Alpha(opacity%3D0)%3B%20opacity%3A.0%3B%20cursor%3Apointer%3B%20text-align%3Acenter%3B%7D%3CBR%3E.model%20a%3Ahover%20span%7B%20color%3A%23fff%3B%20background%3A%23000%3B%20padding%3A0%3B%20display%3Ablock%3B%20width%3A84px%3B%20height%3A54px%3B%20margin%3A-36px%200%200%201px!important%3B%20margin%3A-36px%200%200%200px%3B%20overflow%3Ahidden%3B%20line-height%3A16px%3B%20filter%3A%20Alpha(opacity%3D60)%3B%20opacity%3A.6%3B%20text-align%3Aleft%3B%20text-align%3Acenter%3B%7D%3C%2FP%3E%0A%3CP%3E%C2%A0%3C%2FP%3E%0A%3CP%3E.model2%7Bmargin%3A0%20auto%3B%20width%3A30px%3B%7D%3CBR%3E.model2%20a%3Ahover%7B%20text-decoration%3Anone%3B%7D%3CBR%3E.model2%20a%20img%7B%20border%3A%23fff%201px%20solid%3B%7D%3CBR%3E.model2%20a%3Ahover%20img%7B%20border%3A%23888%201px%20dotted%3B%7D%3CBR%3E.model2%20a%20span%7B%20padding%3A0%3B%20display%3Ablock%3B%20width%3A180px%3B%20height%3A50px%3B%20margin-top%3A-32px%3B%20overflow%3Ahidden%3B%20line-height%3A14px%3B%20filter%3A%20Alpha(opacity%3D0)%3B%20opacity%3A.0%3B%20cursor%3Apointer%3B%20text-align%3Acenter%3B%7D%3CBR%3E.model2%20a%3Ahover%20span%7B%20color%3A%23fff%3B%20background%3A%23000%3B%20padding%3A0%3B%20display%3Ablock%3B%20width%3A480px%3B%20height%3A16px%3B%20margin%3A-36px%200%200%201px!important%3B%20margin%3A-20px%200%200%200px%3B%20overflow%3Ahidden%3B%20line-height%3A16px%3B%20filter%3A%20Alpha(opacity%3D60)%3B%20opacity%3A.6%3B%20text-align%3Aleft%3B%20text-align%3Acenter%3B%7D%3C%2FP%3E%0A%3CP%3E%3C%2Fstyle%3E</cke:encoded><BR></cke:head><BR><cke:body><BR><div class="model"><a href="#" data-cke-saved-href="#" data-cke-saved-href="#"><img src="<A href=" data-cke-saved-src="<A href="http://www.cnwebshow.com/uploadfile/edu/uploadfile/200807/20080715104616471.jpg">/uploadfile/edu/uploadfile/200807/20080715104616471.jpg</A>" border="0" /><span>Kelvin Zegers-拉练喵</span></a></div></P> <P><BR><br><br><br><br><br><br><br><br><br><BR><div class="model2"><a href="#" data-cke-saved-href="#" data-cke-saved-href="#"><img src="<A href=" data-cke-saved-src="<A href="http://www.cnwebshow.com/uploadfile/edu/uploadfile/200807/20080715104617773.jpg">/uploadfile/edu/uploadfile/200807/20080715104617773.jpg</A>" border="0" /><span>Kelvin Zegers-拉练喵</span></a></div><BR></cke:body><BR></cke:html><BR>
当前位置：
上一篇 
