防止文本重叠表格宽度 [英] Prevent text from overlap table td width

问题描述

如何限制表 条目在整个屏幕上展开条目太长?

How can I restrict the table <td> entry to expanding over the entire screen when the entry is too long?

推荐答案

嗯，有 max-width、max-height 和 overflow> 在 CSS 中.

Well, there's max-width, max-height, and overflow in CSS.

所以

td.whatever
{
    max-width: 150px;
    max-height: 150px;
    overflow: hidden;
}

将最大宽度和高度限制为 150 像素，它可以是小于 150 到 150 的任何值，任何不适合内部的内容都将被剪掉并隐藏起来.

would restrict the maximum width and height to 150px, and it can be anything from less than 150 up to 150, and anything that doesn't fit inside that will be clipped off and hidden from view.

Overflow 的默认设置 (overflow: visible;) 是简单地允许任何不适合其指定容器的东西溢出到它的外面.如果您只想水平限制它并且不想隐藏任何内容，word-wrap 可能会有所帮助:

Overflow's default (overflow: visible;) is to simply allow anything that won't fit inside its specified container to just spill over outside of it. If you only want to limit it horizontally and don't want to hide anything, word-wrap may help:

td.whatever
{
    max-width: 150px;
    word-wrap: break-word;
}

word-wrap 会在需要时中断单词，即使它不在单词的末尾.如果您根本不希望表格扩大或缩小，您也可以仅使用 height 和 width 来指定固定大小.

word-wrap will break words whenever it needs to, even if it's not at the end of a word. You can also just use height and width to specify a fixed size if you don't want the table to expand or shrink at all.

这篇关于防止文本重叠表格宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！