css 限制文字长度
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了css 限制文字长度相关的知识，希望对你有一定的参考价值。
<html>
<body>
<table>
<tr>
<td width="50px">AAAAAAAAAAAAAAAAAA</td>
</tr>
</table>
</body>
</html>
实际内容是AAAAAAAAAAAAAAAAAAAAAAA
我不想让文字AAAAAAA超出50px的范围 就是不让td因为文字宽度而变长
也不想让他换行 就要限制他的显示 比如AAAAAAAA... 这样
有没有什么办法啊 请高手帮忙
2楼高手 用中文就不行啊 555
<head>
<style>
#tb1 tdwhite-space:nowrap;text-overflow:ellipsis;overflow:hidden;width:50px;//在这里调节width的值就可以了
</style>
</head>
<body>
<table id="tb1" border=1px style="table-layout:fixed">
<tr>
<td>AAAAAAAAAAAAAAAAAA</td>
</tr>
<tr>
<td>1111111111111111111111111111111</td>
</tr>
</table>
</body>
</html>
////////不知道怎么回事，在table里面的中文就不行，其他元素里面都没问题的，你要的效果用javascript也可以实现的，我写个程序给你
/////////////////////////////////////////////////////////////
<html>
<head>
<script>
function cc()
var a=document.getElementById("tb1").rows.length; //获取表格的行数
for(var zz=0;zz<a;zz++)
var b=document.getElementById("tb1").rows[zz].cells[0].innerText;
if(b.length>10) //如果字符长度大雨10位
document.getElementById("tb1").rows[zz].cells[0].innerText=b.substring(0,10)+"..."; //截取第1到10位 ，并加省略号
</script>
</head>
<body onload=cc()>
<table id="tb1" border=1px style="table-layout:fixed;width:auto;" >
<tr>
<td>AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA</td>
</tr>
<tr>
<td>1111111111111111111111111111111AAA</td>
</tr>
</table>
</body>
</html> 参考技术B 2楼那个菜鸟, 看我的吧, 这么简单的问题都不会还以为自己是对的, 我在大型门户网站做开发, 不爽你是个菜鸟吧.
<style type="text/css">
.tabletable-layout:fixed
.table tdoverflow:hidden;text-overflow:ellipsis;white-space:nowrap
</style>
<table width="200" border="1" class="table">
<tr>
<td>AAAAAAaaaaaaaaaaaaaaaaaaaaAAAAAAAAA</td>
<td>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
<td>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>
</tr>
</table>本回答被提问者采纳 参考技术C 这个不是css的控制范围了..是程序员应该做的.
css最多只能让超出的隐藏掉 而不是显示AAA...
隐藏代码是overflow:hidden;
-------------------------------------------
跟你说过的,不能靠CSS来限制字符的显示..哎,你就是不信.
就是靠这个overflow:hidden;样式..就是超出了这个范围,就不显示而已
Android控件篇 TextView限制文字长度且超过显示省略号
一、ellipsize
<!-- Where to ellipsize text. 在哪里省略文本 -->
<attr name="ellipsize">
<enum name="none" value="0" />
<enum name="start" value="1" />
<enum name="middle" value="2" />
<enum name="end" value="3" />
<enum name="marquee" value="4" />
</attr>
二、maxEms
<!-- 使 TextView 最多有这么多 em 宽 -->
<!-- Makes the TextView be at most this many ems wide. -->
<attr name="maxEms" format="integer" min="0" />
三、singleLine
<!-- Constrains the text to a single horizontally scrolling line
instead of letting it wrap onto multiple lines, and advances
focus instead of inserting a newline when you press the
enter key.
The default value is false (multi-line wrapped text mode) for non-editable text, but if
you specify any value for inputType, the default is true (single-line input field mode).
{@deprecated This attribute is deprecated. Use <code>maxLines</code> instead to change
the layout of a static text, and use the <code>textMultiLine</code> flag in the
inputType attribute instead for editable text views (if both singleLine and inputType
are supplied, the inputType flags will override the value of singleLine). } -->
<attr name="singleLine" format="boolean" />
四、maxLength
<!-- 设置输入过滤器以将文本长度限制为指定数字 -->
<!-- Set an input filter to constrain the text length to the specified number. -->
<attr name="maxLength" format="integer" min="0" />
五、使用
<androidx.appcompat.widget.AppCompatTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLength="10"
android:maxEms="10"
android:singleLine="true"
android:text="欢迎关注彭老希，硬核干货持续更新！" />
以上是关于css 限制文字长度的主要内容，如果未能解决你的问题，请参考以下文章