使用html和CSS的带有省略号的文本对齐设计

Question

范例连结

有两种情况（注意：相同的HTML和CSS都适用于这两种情况）

1）当我的文字较少时，该文字必须与div配合在div的中间。

2）当我有一个大文本时，那必须从div和第三行的省略号开始，但应该是响应性的。

Answer 1

尝试这个：

  display: block;
  /* Fallback for non-webkit */
  display: -webkit-box;
  text-align: center;
  max-width: 400px;
  height: 109.2px;
  /* Fallback for non-webkit */
  margin: 0 auto;
  font-size: 26px;
  line-height: 1.4;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;

参考： http : //codepen.io/martinwolf/pen/qlFdp