布局技巧

div内文本太长截断不换行末尾补充省略号

width:230px;overflow: hidden;text-overflow:ellipsis; white-space:nowrap;

清除浮动

.clear{
 clear:both;
}
.clearL{
 clear:left;
}
.clearR{
 clear:right;
}

 

信息块 头部两端对其 图片文字居中对齐

<style type="text/css">
.tjsp {width:270px;  margin-left:7px; float:left;background:#EFEFEF; padding:3px; border:1px solid red; }
.tjsp .header{ font-size:14px; font-weight:bold; }
.tjsp .header img{ vertical-align:middle;}
.tjsp .title {float:left;}
.tjsp .more {float:right;}
</style>
<div class="tjsp">
            <div class="header">
                <span class="title">
                    <img src="tjsp-car5.gif" />
                    特价商品</span> <span class="more">更多>>
                        <img src="tjsp-5sen.gif" />
                    </span>
            </div>
   
</div>