适配移动端的文字超出隐藏并添加省略号

    // 单行显示超出省略号显示
  white-space: nowrap; // 单行显示
  text-overflow: ellipsis;
  overflow: hidden;

    // 可多行显示超出以省略号显示
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal ！important;
    display: -webkit-box;
    -webkit-line-clamp: 4;     /* 显示4行，为auto时不隐藏 */
    -webkit-box-orient: vertical;

• 查看全部与收起事例

<div class="notice" style="-webkit-line-clamp: 4">
    之鹿艺术培训中心是经国家教育部门批准注册的专业美术高考集训营。始终致力于做“良心教育，负责任的教育”的美术高考集训营显著的升学之鹿艺术培训中心是经国家教育部门批准注册的专业美术高考集训营。始终致力于做“良心教育，负责任的教育”的美术高考集训营显著的升学
</div>
<div class="all" id="all">
    <span class="isViewAll">展开全部</span>
</div>

.notice {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal ！important;
	display: -webkit-box;
	/* -webkit-line-clamp: 4; */
	-webkit-box-orient: vertical;
}

all.onclick = function() {
	if (+mui(".notice")[0].style["-webkit-line-clamp"] === 4) {
		mui(".notice")[0].style["-webkit-line-clamp"] = "";
		document.querySelector(".notice").parentNode.querySelector(".isViewAll").innerHTML = "收起";
	} else {
		mui(".notice")[0].style["-webkit-line-clamp"] = 4;
		document.querySelector(".notice").parentNode.querySelector(".isViewAll").innerHTML = "查看全部";
	}
}