如何使用CSS或事件HTML限制表的宽度?

时间:2012-05-17 04:10:43

标签: html css html-table width

我很好奇是否可以使用CSS,甚至是HTML?说,我有一个包含TABLE的父DIV:

<div class="divClass">
<table class="tableClass">
</table>
</div>

该表显示用户内容,因此我无法控制其文本。有没有办法限制表的宽度,以便它不会超过,比如750像素?

PS。通常情况下,如果没有足够的宽度,表格单元格会将单词包装到下一行,但是对于WordsLikeThisWithoutAnyActualWhiteSpacesBet在他们之间会出现问题。在这种情况下,表格太宽并破坏页面布局。

3 个答案:

答案 0 :(得分:3)

.tableClass {
   max-width: 750px
   word-break: break-all;
 }

应该做的工作。

或者您也可以尝试

.tableClass {
   table-layout:fixed;
}
.tableClass td {
   overflow: hidden;
}

并为第一行中的每个tds指定宽度。

答案 1 :(得分:1)

像这样写:

.tableClass{
 display-layout:fixed;
 word-wrap: break-word;
}

答案 2 :(得分:1)

td{word-wrap:break-word;
max-width: 750px;}