html – 像“table-layout:fixed”之类的东西,但仅限于一个table-column

html – 像“table-layout:fixed”之类的东西,但仅限于一个table-column,第1张

概述我有一个问题,我在一个单元格中有一个非常大的值: 43003A005C00570069006E0064006F00770073005C00730079007300740065006D00330032005C0076006D00470075006500730074004C00690062002E0064006C006C00000043003A005C00500072006F0067007200610 我有一个问题,我在一个单元格中有一个非常大的值:

43003A005C00570069006E0064006F00770073005C00730079007300740065006D00330032005C0076006D00470075006500730074004C00690062002E0064006C006C00000043003A005C00500072006F006700720061006D002000460069006C00650073005C0056004D0077006100720065005C0056004D007700610072006500200054006F006F006C0073005C0076006D0053007400610074007300500072006F00760069006400650072005C00770069006E00360034005C0076006D0053007400610074007300500072006F00760069006400650072002E0064006C006C000000

它的作用是整个表格变得比它应该的大.

我现在添加了table-layout:固定到表中,整个表被调整大小,而不仅仅是具有此值的列.

我想要的是所有其他列都有他们需要的大小,但只有最后一列应该重新排列(使用多行).

/**  * Returns a table with the values from a query  */function tableizeQryRes($arr) {  $isFirst=true;  $tbl = '<table wIDth="100%" border="1" cellpadding="2" frame="Box" rules="all" >';  foreach ($arr as $key => $val) {    //echo $key;    if ($isFirst) {      $tblheader = '<tr align="center" valign="mIDdle"><td></td>';      $tblBody = '<tr><td>'.$key.'</td>';      foreach ($val as $sub_key => $sub_val) {        if ($sub_key == "Msg") {          $tblheader .= '<td >'.$sub_key.'</td>';          $tblBody .= '<td >'.$sub_val.'</td>';        } else {          $tblheader .= '<td>'.$sub_key.'</td>';          $tblBody .= '<td>'.$sub_val.'</td>';        }      }      $tblheader .= '</tr>';      $tblBody .= '</tr>';      $tbl .= $tblheader;      $tbl .= $tblBody;      $isFirst=false;    } else {      $tbl .= '<tr><td>'.$key.'</td>';      foreach ($val as $sub_key => $sub_val) {        if ($sub_key == "Msg") {          $tbl .= '<td >'.$sub_val.'</td>';        } else {          $tbl .= '<td>'.$sub_val.'</td>';        }      }      $tbl .= '</tr>';    }  }  $tbl .= '</table>';  echo '<div >';  echo $tbl;  echo '<br/>';  echo '<br/>';  echo '</div>';}

如果我加上某事.喜欢style =“word-wrap:break-word; wIDth:40%”和table-layout:修复其他单元格也固定不再调整.

BTW.:所有列的长度都是可变的(大约有150 000行).前5列很小,只有6.列包含一条消息,有时带有空格,有些则没有.

解决方法 CSS3文本模块允许您打破长单词,以便它们使用自动换行包含多行:break-word.但是,在某些情况下会发生什么
因为一个长长的不断字,所以在长字之前是一个很大的白色间隙
从一个新行开始,即使短词可以跟随长词.

解决这个问题的一种方法是使用white-space:pre-wrap和word-break:break-all,它可以防止在长的非破坏词之前形成长的空格.

然而,不利的一面是,一些小词可能会缠绕到第二行.

你有两个选择,自动换行方法可以在一个长的非破坏词之前留下大的空隙,或者whtIE-space / word-break方法可以留下一些小词包裹
大约两行.

我认为这就是你可以使用CSS3.其他任何东西都需要一些JavaScript
辅助解决方案

table {  border: 1px dotted blue;  table-layout: fixed;  wIDth: 100%;}table td {  border: 1px dashed blue;  vertical-align: top;}table td.wrapPing {  wIDth: 350px;  white-space: pre-wrap;  word-break: break-all}
<table>  <tr>    <td>a regular table cell with some text</td>    <td >some short words in the text andaverylongword to fill up the line 43003A005C00570069006E0064006F00770073005C00730079007300740065006D00330032005C0076006D00470075006500730074004C00690062002E0064006C006C00000043003A005C00500072006F006700720061006D002000460069006C00650073005C0056004D0077006100720065005C0056004D007700610072006500200054006F006F006C0073005C0076006D0053007400610074007300500072006F00760069006400650072005C00770069006E00360034005C0076006D0053007400610074007300500072006F00760069006400650072002E0064006C006C000000 and a few words at the end    </td>  </tr></table>
总结

以上是内存溢出为你收集整理的html – 像“table-layout:fixed”之类的东西,但仅限于一个table-column全部内容,希望文章能够帮你解决html – 像“table-layout:fixed”之类的东西,但仅限于一个table-column所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1044078.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-24
下一篇 2022-05-24

发表评论

登录后才能评论

评论列表(0条)

保存