Div和Span元素的最大长度

Question

如何为Span和Div元素设置最大长度？

- Puru

Answer 1

There are the

max-height / max-width

CSS属性可以限制块级元素（即非标签）的宽度。 参考文献

请注意，它们不受IE 6支持。

- Pekka

Answer 2

input和textarea html标签有maxlength属性，但div和span元素没有。为了限制用户在或

元素中输入超过maxlength的字符，您可以使用以下方法来使用javascript和jquery:

您可以在或

元素上添加keydown事件监听器，并在事件监听器中添加以下函数。

1：使用javascript的substring方法。

$("#div-element").on("keydown", function () {
    var value = $("#div-element").val();
    if (value.length > maxlength) {
        $("#div-element").val(value.substring(0, maxlength));
    }
}());

2：在事件中返回false。

$("#div-element").on("keydown", function () {
    var value = $("#div-element").val();
    if (value.length > maxlength) {
        return false;
    }
}());

这两个问题都需要进行后续处理，即 substring 方法会改变光标位置，在 keydown 方法中我们需要检查按下了哪个键，否则甚至在按下退格键或删除键时也会返回 false。

- Yashashvi

Answer 3

如果包含的文字太长，div或span可能会溢出：

<div style="width: 80px; overflow: hidden;" >hhhhhhheeeeeellllllllllooooo</div>

• 您可以使用div包裹一个span。如果文本中没有空格，则它将截断内容，但这将防止溢出发生。

如果长单词是问题，CSS3的解决方案可能是：

style="width: 80; word-wrap: break-word;"

- PbxMan

Answer 4

如果你指的是宽度，那么请使用 CSS 的宽度属性：

<div style='max-width:100px'>Content</div>
<span style='max-width:100px; display:block;'>Content</span>

如果你真的是指内容长度，那么在HTML中是无法实现的。你需要使用一段JavaScript代码来完成。看一下JQuery，它非常容易实现。大致代码如下：

$('#yourDivId').html().length

- Palantir

---

我不明白.length这一部分的意思。这是要做什么的？难道不是HTML字符串的字符长度吗？ - Pekka

Pekka：是的 ：P 一开始我觉得他试图获取HTML内容的长度。然后我意识到他可能是指宽度... - Palantir

好的，另一方面，他确实在谈论“maxlength”。这可能是一个打字错误或对表单元素属性的引用。等他评论时我们就会知道了。 - Pekka

Answer 5

你是指最大宽度吗？

max-width: ??px;

- hallie