0

我有 2 个 div，其中有一些文本。它们被封装在具有固定高度和宽度的父 Div 中。如果文本溢出到父 div 之外，我想省略文本。

这是我的 HTML

<html>
<head>
    <style>

    .pDiv {
        width:50px;
        height:20px;
        border: 1px  solid red;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .div1 {
        position: relative;
        float: left;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .div2 {
        position: relative;
        float: left;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    </style>
</head>
<body>
    <div class ='pDiv'>
        <div class ='div1'>test testing</div>
        <div class ='div2'>test1</div>
    </div>

</body>
</html>

如果 div1 文本很长或 div2 文本很长，我希望文本被省略。

有什么解决办法吗？

4

1 回答 1

1

省略号没有显示，因为 div1 和 div2 没有分配给它们的宽度，因此它们不知道从什么时候开始截断/缩写。也许您可以为每个分配 100% 的宽度。也就是说，如果您同时添加 width:100% 这两个类，您会在文本中看到省略号。

我建议查看以下链接：http ://www.quirksmode.org/css/textoverflow.html ，其中描述了问题及其要求。

于 2012-08-07T18:09:54.110 回答