单元格内文本显示超过单元格宽度的解决办法

开发过程中,表格单元格里的显示数据经常超出单元格的宽度。遇到这种情况一般会这样处理。

1、超出部分显示省略号(...)

解决办法:在css中设置  text-overflow: ellipsis;

text-overflow:

2、换行显示

解决办法: 在css中设置   white-space:normal;

white-space:(1)normal : 默认 。空白会被浏览器忽略。

(2) pre : 换行和其他空白字符都将受到保护

(3) nowrap : 强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象

示例代码:

<html>
<head>
<style type="text/css">
p
{
white-space:normal/pre/nowrap;
}
</style>
</head>
<body>

<p>
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
</p>

</body>
</html>

运行效果图:(1)

(2)

(3)

希望大家给点意见。

时间: 2024-09-29 02:30:37

单元格内文本显示超过单元格宽度的解决办法的相关文章

安装IIS之后运行aspx 显示“服务器应用程序不可用” 解决办法

引起这个的原因大概是现安装了.Net Framework,后装的IIS导致.Net没有在IIS里注册.  另外,还有可能是ASPNET账户没有IIS所指定服务器目录的权限.在资源管理器中找到“工具-文件夹选项-查看-使用简单文件夹共享(推荐)”,把前面的勾去掉,然后在服务器指定目录上点右键,属性-安全-添加-高级-立即查找,把ASPNET这个账户添加进去,给它指定完全访问的权限.这样做了以后就会发现没有了那个错误,不过如果访问数据库可能有会提示ASPNET这个账户没有权限访问数据库.这个提示就清

wm命令使用方法及LCD显示图标大小不正常时解决办法

注:Android 4.3引入的wm工具 wm命令及用法: 系统说明: usage: wm [subcommand] [options] wm size [reset|WxH] wm density [reset|DENSITY] wm overscan [reset|LEFT,TOP,RIGHT,BOTTOM] wm size: return or override display size. wm density: override display density. wm overscan:

LYNC客户端不显示通讯组里的用户的解决办法。

LYNC客户端不显示通讯组里的用户的解决办法 错误图如下: 解决办法:ISA代理服务器的问题,把代理服务器高级里加上lync服务器的名字就可以了.

解决在圆形内做动画而不超出圆外的解决办法

注意:此次动画的目的是在圆内做动画,而动画效果不会超出圆的范围外 在制作这个效果的时候,我一开始想到的就是以下的做法: CSS: .circle{width: 200px;height: 200px;border-radius: 200px;background: rgba(0,0,0,0.5);overflow: hidden;position: absolute;} .text{position: absolute;top: 0;left: 0;-webkit-transform:trans

文本图片自适应高度小bug以及解决办法

自定义cell的文本图片自适应高度代码,如果存在自定义的cell赋值封装,就必须将自适应高度代码写在这个方法中 点击效果: 注:- (void)layoutSubviews 方法不能同时操作,否则会出现cell的高度错乱 显示: 点击:

一处折腾笔记:Android内嵌html5添加原生微信分享的解决办法

有一段时间没有瞎折腾了.这周一刚上班萌主过来反映说:微信里面打开聚客宝,分享功能是可以的(这里是用微信自身的js-sdk实现的),但是在android应用里面打开点击就没反应了:接下来狡猾的丁丁在产品群里AT我说:偶们的产品设计不是一直都被技术给反压制住么?真是气死,呵呵.自己刚好有空又有兴趣,于是研究了下,没曾想竟也研究出来了.事后我对整个操作过程整理了下,方便他人也提升自己. 废话少扯,下面上干货. 我的思路是:在点击h5上的分享图标时,触发js事件,在这里面可以对当前设备的操作系统和浏览器

oracle 登录 http://localhost:1158/em/console 不显示,账号无法登陆的解决办法

问题: 网页没显示,甚至登录账号的表单都没有.解决目标:能访问到 http://localhost:1158/em/console 的登录表单,今儿成功登录 简单概括原因: C:/oracle/product/10.2.0/db_1/oc4j/j2ee 下文件夹名称 OC4J_DBConsole_<更改的部分>_orcl 中 “<更改的部分>” 和 C:/oracle/product/10.2.0/db_1/NETWORK/ADMIN/listener.ora 文件中 LISTEN

部分安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法

前端JS中使用XMLHttpRequest 2上传图片到服务器,PC端和大部分手机上都正常,但在少部分安卓手机上上传失败,服务器上查看图片,显示字节数为0.下面是上传图片的核心代码: HTML <input type="file" id="choose" capture="camera" accept="image/*"> JavaScript var filechooser = document.getEleme

bootstrap时间控件显示在模态框下面的解决办法

一针见血:修改 bootstrap-datepicker.js 文件 var zIndex = parseInt(this.element.parents().filter(function(){     return $(this).css('z-index') !== 'auto';    }).first().css('z-index'))  +10; 将+10改为+99999999; 原因:z-index是设置元素的堆叠顺序,从负到正表示从下到上堆叠,这里使用css方法将z-index设