当文字超过两行时，显示省略号，当文字未超过两行时，不显示省略号，详细标签始终在文字后面

只用 css 只能做到第一行超出自动省略号： white-space: nowrap; overflow: hidden; text-overflow: ellipse 多行的话，可以用这个库： https://github.com/josephschm... 楼下有人说 line-clamp 的，这个兼容性：

这个百度一下马上解决了吧。

如何实现如下效果

<a href="">【详细】</a>

【1】css解决

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .txt{
            width: 200px;
            word-break: break-all;
            text-overflow: ellipsis;
            display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
            -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
            -webkit-line-clamp: 2; /** 显示的行数 **/
            overflow: hidden;  /** 隐藏超出的内容 **/
            
            /*1，word-break:break-all 例如div宽200px，它的内容就会到200px自动换行，
            如果该行末端有个英文单词很长（congratulation等），它会把单词截断，
            变成该行末端为conra(congratulation的前端部分)，下一行为tulation（conguatulation）的后端部分了。
            2，word-wrap:break-word 例子与上面一样，但区别就是它会把congratulation整个单词看成一个整体，
            如果该行末端宽度不够显示整个单词，它会自动把整个单词放到下一行，而不会把单词截断掉的。*/
        }
    </style>
</head>
<body>
<p class="txt">溢出文字隐藏溢出文字隐藏溢出文字隐藏溢出文字隐藏溢出文字隐藏溢出文字隐藏溢出文字隐藏溢出文字隐藏</p>
</body>
</html>

【2】js判断字的个数

str = str.length > 50? str.substr(0,str.length-3) + '......':str

如何实现如下效果

你尚未登录，登录后可以

body :first-child(不是body:first-child，中间有空格)伪类选择器到底选中了什么元素？

CSS如何让指定的某个Tag不显示（比如：display=none），但是还是占有位置呢？

如何实现类似豆包的AI改写框跟随内容滚动效果？

如何在CSS中实现滚动条不溢出圆角框？

请问，是否可以设定Table的宽度，或者不让其超过父容器呢？

如何在Ant Design表格中同时设置scroll.x和scroll.y且表头不换行？

表数据复制一条添加到数据库，前端跳转到数据所在的page页，滚动到对应行并添加高亮样式异常？