首页商品名称换行问题

2016-07-07 16:06 来源:www.chinab4c.com 作者:ecshop专家

未命名2.jpg 未命名.jpg
第一张图是原始未修改版本
第二章图是修改后错误版本

我想要达到的效果是:字体显示两排;而且居中显示;最好用宽度而不是字数控制。

我修改了cat_goods.lbi文件,原始代码是:
</div>
<ul class="item itemm">
<li style="padding-bottom:0">
<a href="{$goods_cat.style}" target="_blank"><img src="images/pic/catapic_{$goods_cat.id}.jpg" /></a></li>
<!--{foreach from=$cat_goods item=goods}-->
<li><a href="{$goods.url}"><img src="{$goods.thumb}" alt="{$goods.name|escape:html}" width="120" height="155"/>{$goods.name|truncate:9}<span class="price">
<!-- {if $goods.promote_price neq ""} -->
{$lang.promote_price}{$goods.promote_price}
<!-- {else}-->{$goods.shop_price}<!--{/if}-->
</span></a></li>
<!--{/foreach}-->
</ul>
</div>

谢谢!

回答:
<li>
<a href="{$goods.url}"><img src="{$goods.thumb}" alt="{$goods.name|escape:html}" width="120" height="155"/></a>

<a class="new_title" href="{$goods.url}">{$goods.name|escape:html}</a>
<span class="price">
<!-- {if $goods.promote_price neq ""} -->
{$lang.promote_price}{$goods.promote_price}
<!-- {else}-->{$goods.shop_price}<!--{/if}--></span>

</li>

将图片和标题分开.

然后单独定义标题的css样式.

.new_title {display:block;height:36px; line-height:18px;overflow:hidden;text-align:center;}