最近一直想美化博客的文字效果和增加文章末尾的轉發提示，所以這兩天抽空研究了一下CSS，前兩篇可以翻我的博客，今天寫的這篇是介紹增加文章末尾的轉發提示，效果如文章末尾所示，好了，CSS很簡單，我就不介紹了，直接把我的代碼寫出來供大家參考：
<head> <style type="text/css"> * { margin:0; padding:0; } h3 { font-size:15px; color:#0066CC; line-height:1.5em; } p { font-size:12px; text-indent:2em; line-height:1.5em; } #container { background-color:#33FFCC; height:200px; margin:0 auto; margin-top:10px; padding-right:3px; border:1px dotted #666; position:relative; } #leftContent { position:absolute; top:2px; left:4px; } #leftContent img{ height:192px; width:200px; border:1px solid #ccc; padding:2px; } #rightContent { margin-left:220px; } </style> </head> <body> <div id="container"> <div id="leftContent"><img src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=747535597,1152462222&fm=27&gp=0.jpg" alt="" /></div> <div id="rightContent"> <h3>友情提示</h3> <h3>作者：<a href="http://www.cnblogs.com/mhq-martin/"> mhq_martin</a></h3> <h3>博客園地址：<a href="http://www.cnblogs.com/mhq-martin/"> <span style="color: red; font-size: xx-small;">http://www.cnblogs.com/mhq-martin/</span></a></h3> <h3>本文版權歸作者和博客園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連接，否則保留追究法律責任的權利。</h3> </div> </div> </body> </html>
效果如下圖所示：
