Shopify产品标题实现多行显示Css代码

深圳客户提出首页产品标题显示2行,超出的部分用省略号显示,刚开始用Shopify模版 String 过滤语句来控制标题显示长度,但手机端和PC端因为屏幕大小原因,PC端显示2行,在手机端显示4行,客户要求手机端和PC端显示的行数是一致的,当时以为修改不了,自己以前没有接触过类似的需求,于是通过搜索Css的解决方案,因为一般都是通过Css响应式控制来实现手机端和PC端样式,没想到还真找到解决方案,先分享出来,希望以后对你修改Shopify模版的时候有帮助。感谢有要求的客户,客户每次看似无法实现的要求,对自己都是一种全新的挑战,挑战成功,都将是一个很大的收获!

overflow:hidden;

display:-webkit-box;

-webkit-line-clamp:2;

text-overflow:ellipsis;

-webkit-box-orient;vertical;

 

Back to blog
  • 环节1:调研

    数据分析,发现细分市场机会。研究区域市场竞争同行,研究同行产品价格定位,借鉴优秀网站建设思路和营销思路。

  • 环节2:排除

    谷歌广告排除不相关搜索关键词,不相关展示位置。FB拉新广告排除已互动过用户,已访问过网站用户。

  • 环节3:分析

    通过规范设置流量来源,通过GA分析Fb广告定位,广告素材。分析网站用户人群画像,依据人群转化数据,优化设置谷歌广告定位。