v2ee - CSS
type: channel
link: https://v2ee.top/tag/CSS/
items: css中设置table中的td内容自动换行

css中设置table中的td内容自动换行
type: item
date: 2020-04-01T08:02:29+00:00
description: 在项目中，有用到表格。因为有的内容比较长，所以需要列宽大一些，有的内容比较短，列宽就小一些。遇到了一个问题，在学校联系方式表里面，联系人电话/电子邮件这两列，无论我加多大的宽度，内容总是会把表格列撑的很宽，百度了一下，发现原因是这样的：一般字母的话会被浏览器默认是一个字符串或者说一个单词，所以不会自动换行所以需要设置一下，让表格内容自动换行。1.在中设置样式style为word-wrap:break-word;word-break:break-all;（一般情况只需要设置word-break:break-all即可，但是有时候需要加word-wrap:break-word ）2.把表格的sytle的table-layout：fixed，就是表格固定宽度，就是表格既要自适应他外面的容器，也不要撑出去，然后设置td的word-wrap：break-word；换行，问题就解决了