设置table的td宽度,不随文字变宽
页面中table宽度设置width="600px"之后,宽度仍然不是固定的,文字太长后不换行,把table都撑变形了。
解决办法:
table 设置 宽度,绝对宽度和相对都可以
table-layout:fixed ;
并且,第一行的<td>设置宽度,留一个不设,自由伸缩。
这样操作之后,table是宽度固定了,但是里面的文章如果很长,文字还是会跑出来
解决办法:
在 td 里面 加上 style="word-wrap:break-word;" 自动换行就好了,如果不想换行,可以将超出内容设为隐藏,并且用省略号代替:
在td上面加
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;(目前仅在IE8测试通过)
设置table的td宽度,不随文字变宽的更多相关文章
- 前端福利之个性化设置table的td宽度(总结)
很多时候,我们在用到table时,都希望随意设置 每个单元格的宽度,而不希望单元格被内容撑开table的样式. 1.首先,设置table的宽度 width=“1000” 或者 width=“100%” ...
- table中td的宽度不随文字变宽
1.设置了table的宽度后,宽度仍然不固定,td的内容一多,很容易吧table撑变形.有些时候我们需要设置固定的宽度. 解决办法 table的css 加入样式 table-layout:fixed ...
- css控制table的td宽度
今天发现即使设置table的td.th宽度,仍是不管用,是根据table的td的内容来适应宽度,导致其他的th.td丢失. 下图就是浏览器渲染的table,导致缺失"端口"这一列, ...
- layui静态表格固定td宽度,table固定td宽度
正在做一个项目,要求数据表的列是不固定的,有可能是有10列,有可能是20列,第一列宽度要固定,然后我怎么设置都没有用, 这个问题困扰了我三天,后来终于百度到了, 这个博客: https://www.c ...
- 如何让table中td宽度固定
table中td会随着里面的内容伸缩,设置其width样式并没有效果.这个时候需要下面的CSS可以实现. 首先是设置table .table {table-layout:fixed;} 其次是td . ...
- table调整td宽度整理-完美解决--费元星前端
个人整理例子,留下做个备份 最终重要的几句话 0.日期格式 format="ognl:dateFormat" <td align="center"> ...
- HTML设置<table>的<td>横跨3列
第一步:html中 <table> <tr> <td>列一</td> <td>列二</td> <td>列三</ ...
- 怎样设置table中td的高度为1px
在制作edm时会遇到须要设置td的高度为1px,假设td标签中有 时不管你怎么设置td的高度都没用,最小高度都是18px. 这时须要把表格中的 去掉.例: 原来是这种: <tr> < ...
- HTML中table的td宽度无法固定问题
设置了 width="10%" 依然会被内容撑大, 加了 style="word-break:break-all;" 属性就好了.效果是内容自动回车. 此属性不 ...
随机推荐
- Telnet命令参考手册
Dubbo2.0.5以上版本服务提供端口支持telnet命令,使用如: telnet localhost 20880 或者: echo status | nc -i 1 localhost 20880 ...
- 检查Linux服务器性能命令详解
如果你的Linux服务器突然负载暴增,如何在最短时间内找出Linux性能问题所在? 通过执行以下命令,可以在1分钟内对系统资源使用情况有个大致的了解. uptime dmesg | tail vmst ...
- 重新编写equals()方法,hashCode()方法,以及toString(),提供自定义的相等标准,以及自描述方法
下面给出一个实例,重新编写equals()方法,提供自定义的相等标准 public class PersonTest { public static void main(String[] args) ...
- Django框架_URLconf、Views、template、ORM
目录: 一.Django-MTV MTV模型 Django基本命令 视图层之路由配置系统(views) 视图层之视图函数(views) 模板层(template) 二.Django-model基础 O ...
- java jdom 解析CDATA内容
package com; import java.io.IOException; import java.io.StringReader; import java.util.List; import ...
- es6的Set和Map数据结构
Set 和 Map 数据结构 Set WeakSet Map WeakMap Set § ⇧ 基本用法 ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set ...
- 哪个地图API 好用
之前我们能用的地图软件还寥寥无几,而且一个地图包动辄就上百M,还不支持GPS,没有实时路况,没有卫星图,一年也未必更新一次.现如今的地图功能已经极大丰富了,开发者的项目选择性也很大,地图哪个受众比较多 ...
- pom.xml文件报错:web.xml is missing and <failOnMissingWebXml> is set to true
这个错误原因是因为项目无法加载到web.xml,所以需要配置web项目的目录.具体解决,配置步骤如下: 1.右键项目属性,配置项目目录 /src/main/webapp,如果没有,新增一条 2.配置 ...
- EF Core 2.0中怎么用DB First通过数据库来生成实体
要在EF Core使用DB First首先要下载三个Nuget包,在Nuget的Package Manager Console窗口中依次敲入下面三个命令即可: Microsoft.EntityFram ...
- C#中 哪些是值类型 哪些是引用类型
DateTime属于 结构类型,所以是 值类型 在 C#中 简单类型,结构类型,枚举类型是值类型:其余的:接口,类,字符串,数组,委托都是引用类型