<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>这是一个学习案例</title>
<style type="text/css">
body { margin:0; padding:0; font-size:14px; color:#000;}
.fl { float:left;}
.fr { float:right;}
.cb { clear:both;}
.clearfix:after { clear:both; content:"."; display:block; visibility:hidden; height:0;}
注:此上为清除浮动样式
.clearfix {zoom:1;}
.biaoti:after { content:"晁冲之"; font-size:12px; color:#666; padding-left:10px; }
.rongqi { width:600px; margin:auto; padding:50px 0px;}
.left { width:370px; background:#09F; padding:10px; line-height:25px; color:#fff;}
.right { width:180px; background:#C93; padding:10px; font-size:12px; color:#FFF;}
.right p { display:block; margin:0; padding:10px 0 0 0; line-height:22px;}
</style>
</head>
<body>
<div class="rongqi">
<h2 class="biaoti">汉宫春</h2>
<div class="clearfix" style="border:1px solid #cc0000;">
<div class="left fl">
<p>潇洒江梅,向竹梢稀处,横两三枝。东君也不爱惜,雪压风欺。无情燕子,怕春寒、轻失花期。惟是有、南来归雁,年年长见开时。</p>
<P>清浅小溪如练,问玉堂何似,茅舍疏篱?伤心故人去后,冷落新诗。微云淡月,对孤芳、分付他谁。空自倚地、清香未减,风流不在人知。</P>
</div>
<div class="right fr">
<P>大义赏析:</P>
<p>长在茅舍疏篱下的野梅。它寂寞得很,就连燕子都不肯与它亲近;它又艰难得很,无情的风雪经常向它施加淫威。可它却就是耐得住寂寞,经得起摧残。你看清如白练的小溪旁,疏影横斜,清香依旧。 </p>
</div>
</div>
</div>
</body>
</html>
转载于:https://my.oschina.net/dingliu/blog/756843