商品详情收缩产品展示

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

有时网站商品详情的内容很多很长时,会把页面拉得老长,就想到用这个方法,有喜欢的顶一下,不喜请路过?
不过我现在的还做的不够好,呵呵。如有人能改进请共享?
首先打开:style.css在最后增加:
  1. /* 商品详情滚动修改 */
  2. .goods_intro_con{
  3. width:766px;
  4. height:426px;
  5. margin:2px 0;
  6. overflow:hidden;
  7. text-align:left;
  8. overflow-x:hidden;
  9. overflow-y:scroll;
  10. }
  11. .goods_intro{text-align:left; margin:0px 5px 0px 12px;}
  12. .goods_intro p{clear:both;}
  13. .goods_intro p.title{color:#260E06;line-height:22px;}
  14. .goods_intro p.con{color:#666666;padding-left:12px;line-height:18px;}
  15. .goods_intro p.intro_title{color:#333333;line-height:20px;}
  16. html{
  17. scrollbar-shadow-color: #CFCFCF;
  18. scrollbar-highlight-color: #CFCFCF;
  19. scrollbar-3dlight-color: #fff;
  20. scrollbar-darkshadow-color: #fff;
  21. scrollbar-arrow-color: #797979;
  22. scrollbar-face-color: #EFEEEE;
  23. scrollbar-track-color: #F8F8F9;
  24. }
复制代码


然后在goods.dwt的商品详情内容代码前面加上红色字体的代码:
<div class="goods_intro_con">
<div class="goods_intro">

{$goods.goods_desc}
</div>
</div>

OK很很简单吧。不过我现在的还有一点不满意的就是,拉动条没有与边框在一条线上,对内容的宽度也没有把握好。好了不多说了,反正现在看起也不难看。看演示吧:http://www.188td.net/s/goods-50.html


回答:
这样弄是可以让布局美观一点,但是很多人都没有采用这种方法,顶下吧,谢谢楼主的共享!

多谢 多谢