限制HTML列中的字符 [英] Limit the character in HTML column

问题描述

你好，我有一张看起来像这样的表

我想限制每列中的字符数，所以它会正确显示，在这张图中我没有包含任何空格，所以当它达到最大宽度时它不会进入下一行。

这是我的css代码。

 ＃table-main {
 width：740px; 
 font-size：12px; 
 margin：0 auto; 
 border-collapse：分开; 
 border-spacing：2px; 
} 
 
＃table-main th {
最大宽度：50px; 
 padding：5px; 
颜色：＃B22222; 
背景：＃7fd9c1; 
 text-align：left; 
} 
 
＃table-main tr.holiday td {
 background：＃ffc0cb; 
} 
 
＃table-main td {
 max-width：50px; 
 padding：5px; 
背景：＃D1EEEE; 
 text-align：left; 
 table-layout：fixed 
 word-wrap：打破单词; 
} 
  

任何想法如何实现它？
Thanks。

解决方案

试试这个，它会打破单词以及包装内容

  word-break：break-all; 
 word-wrap：分词; 
  

Hello I have a table that look like this

I want to limit the number of characters within each column, so it will display properly, in this picture I haven't included any space to it, so it did not go into the next line when it reach the max-width.

and this is my css code.

#table-main {
    width: 740px;
    font-size: 12px;
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 2px;
}

#table-main th {
    max-width: 50px;
    padding: 5px;
    color: #B22222;
    background: #7fd9c1;
    text-align: left;
}

#table-main tr.holiday td {
   background: #ffc0cb;
}

#table-main td {
   max-width: 50px;
   padding: 5px;
   background: #D1EEEE;
   text-align: left;
   table-layout:fixed
   word-wrap: break-word;
}

Any idea how to achieve it? Thanks.

解决方案

Try this, it will break by the word as well as wrap the content

word-break: break-all;
word-wrap:break-word;

这篇关于限制HTML列中的字符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！