欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

css实现多行文字限制显示

程序员文章站 2022-08-09 22:46:55

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">

<meta name="apple-mobile-web-app-capable" content="yes">

<meta name="apple-mobile-web-app-status-bar-style" content="black">

<meta name="format-detection" content="telephone=no">

<title>css实现多行文字限制显示</title>

<style>

#test {

display: box;

display: -webkit-box;

box-orient: vertical;

-webkit-box-orient: vertical;

line-clamp: 2;

-webkit-line-clamp: 2;

overflow: hidden;

text-overflow: ellipsis;

}

</style>

</head>

<body>

<p id="test">多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示多行文字限制显示</p>

</body>

</html>