奇新CMS/.box区域网页代码及样式
来自站长百科
<div class="box"></div>块定义
.box主要定义在#main下，代码如下：
<div class="box">
<div class="box_h"><b><!--左侧内容--></b><i><!--右侧内容--></i></div>
<div class="box_b"> <!--这里是网页代码显示区域-->
<b class="bl"></b><i class="br"></i> </div>
<div class="box_f"><b></b><i></i></div>
</div>
<style type="text/css">
.box{/*样式定义说明*/ }
.box .box_h{ /*块内头部显示信息*/}
.box .box_h b{ /*左侧显示栏目标题等*/}
.box .box_h i{ /*右侧显示更多或其他链接*/}
.box .box_b{ /*块内主要内部显示区域*/}
.box .box_b b.bl{/*用于此处扩展功能，如背景图片*/}
.box .box_b i.br{/*用于此处扩展功能*/}
.box .box_f {/*块内底部显示信息，用于扩展功能*/}
.box .box_f b{/*如需设置此位置信息，可添加此样式定义*/ }
.box .box_f i{/*如需设置此位置信息，可添加此样式定义*/ }
</style>
CSS样式示例：
.box{height:1%;position:relative;margin: 0 0 10px;background: url(images/box_h_c.gif) repeat-x 0 0 ;border-bottom:0}
.box .box_h{position:relative;color:#0e7044;height:37px;line-height:37px;background: url(images/box_h_b.gif) no-repeat 15px 60% ; }
.box .box_h b{position:absolute;left:0;top:0;height:37px;padding-left:17px;background:url(images/box_h_l.gif) no-repeat 0 0;}
.box .box_h i{position:absolute;right:0;top:0;height:37px;padding:0 15px 0 0;background:url(images/box_h_r.gif) no-repeat 100% 0}
.box .box_h i a{color:#999!important}
.box .box_h i a:hover{color:#666!important}
.box .box_b{padding:10px 10px 2px;border: solid #ABDAC8;border-width:0 1px;_width:100%}
.box .box_h a{color:#0e7044;}
.box .box_f {height:15px;position:relative;background: url(images/box_f_c.gif) repeat-x 0 100% }
.box .box_f b{height:15px;width:15px;position:absolute;left:-1px;;bottom:0;_bottom:-1px;background: url(images/box_f_l.gif) no-repeat 0 100%;}
.box .box_f i{height:15px;width:15px;position:absolute;right:0;;bottom:0;_bottom:-1px;background: url(images/box_f_r.gif) no-repeat 100% 100%;}