如何让超出范围的文本自动显示为省略号(CSS)

溢出文本显示省略号的效果:

white-space:nowrap;  强制文本在一行显示

overflow:hidden;   溢出内容为隐藏

text-overflow:ellipsis;  当对象内文本溢出时显示省略标记(...)

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-25 17:05:15

如何让超出范围的文本自动显示为省略号(CSS)的相关文章

jQuery获取自动截取过长的文本内容,显示成省略号

table中如果td的内容过多,则会把td撑的很宽, 显得不美观. 如果能让td既美观.也能看到完整的效果.. 我们则需要,在生成td之前,给指定样式.. 这里采用jQuery来实现. //页面加载之后,设置.样式. jQuery(function(){ //使用id选择器;例如:tab对象->tr->td对象. $("#high_light tr td").each(function(i){ //获取td当前对象的文本,如果长度大于25; if($(this).text(

JAVA Eclipse开发Android如何让超出界面的部分自动显示滚动条

在原有布局的最外围添加一层ScrollView,注意原有布局的声明也要删了 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="ma

选取文本自动显示菜单条

代码: function getSel(e) { var e = e ? e : window.event; if (window.getSelection) { if (window.getSelection() == '') { return false; } else { txt = window.getSelection().toString(); var div = document.getElementById('baike-menu'); div.style.display = '

css文字超出自动显示省略号

只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ overflow: hidden; } css文字超出自动显示省略号显示省略号 css文字超出自动显示省略号 css文字超出自动显示省略号显示省略号 02.针对table table{ table-layout:fixed; } table td{ word-break:keep-all;/* 不换行

用javascript实现控制一个文本框的输入字数限制,超出字数限制文本框飘红显示-面试题

用javascript实现控制一个文本框的输入字数限制,超出字数限制文本框飘红显示. html <textarea name="" id="text" cols="30" rows="10" maxLength=10></textarea><br> <span id="span"></span> javascript var str = docum

关于JLable列表的自动滚动条的显示:当JLable列表的内容超出JPanel面板所规定的高度时,自动显示滚动条的方法

关于JLable列表的自动滚动条的显示:当JLable列表的内容超出JPanel面板所规定的高度时,自动显示滚动条的方法: 通过下面的方式把JLable表的宽度和高度锁死,不能根据列表内容的增加而自动出现滚动条: JPanel tablePanel = new JPanel(); JScrollPane jScrollPane1 = new JScrollPane(); JTable teacherTable = new JTable(); //表 teacherTable.setMaximum

DIV内容超出长度显示省略号,鼠标移上自动显示全部内容(EasyUI DataGrid)

如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此DIV指定3个关键样式{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} 指定样式后,文本超长已经会显示省略号了.如果想鼠标移上去显示全文的话,有2个办法: 一个是把全部文本写在div的title属性里面,还有一个办法是在原

CSS中超出的文本内容显示省略号

首先,分析超出内容有两种情况,单行内容超出和多行内容超出,以下逐一说明: 单行内容操作: 单行操作必须有width属性,就是元素要有宽和高的限制才可以,具备以上基本条件之后,编写以下代码 overflow:hidden; text-overflow:ellipsis; white-space:nowrap; 此时,即可看到单行文本超出显示省略号的效果. 多行内容操作: 多行文本超出省略早期是没有该写法的,本文使用的是css3对WebKit的拓展写法,需要注意,该方法只适用于WebKit浏览器和移

div超出内容后自动显示滚动条

只需要用到css的一个overflow:auto的属性就可以实现这效果了.下面我们看看代码和实现的效果 HTML代码如下: <textarea name="" id="message" cols="30" rows="10" placeholder="" maxlength="2000" style="overflow: auto;" class="&