Java JLabel 中 HTML 表格单元格中的文本垂直居中

发布于 2024-11-25 07:47:34 字数 1111 浏览 2 评论 0原文

我有一个显示在 JLabel 中的 HTML 表格（带有 CSS 的样式）。我希望单元格的内容（单个短行文本）水平和垂直居中。水平居中很容易，但我似乎无法将文本垂直居中。我尝试过使用 middle 和 center 参数来使用 vertical-align: 和 valign: 。我已经研究了一些技巧，但似乎没有一个可行，而且我尝试过的那些技巧也不起作用。

我现在拥有的：

内联（在

table.outer {
    background:#F0F0F0;
    border-collapse:collapse;
    border:none;
}

td.outer {
    border-style:solid;
    border-width:1pt;
    border-color:#888888;
    padding:0pt 0pt 0pt 0pt;
}

table.inner {
    border-collapse:collapse;
    border:none;
}

td.title {
    width:75pt;
    background:#BFBFBF;
    padding:1.5pt 0pt 1.5pt 0pt;
}

HTML 的相关部分：

<body bgcolor=#F0F0F0>
<table class='outer'>
  <tr>
    <td class='outer' valign=top>
    <table class='inner'>
      <tr>
        <td class='title' rowspan=3>
          <p class='title'>Current Run</p>
        </td>
      </tr>
    </table>
    </td>
  </tr>
</table>
</body>

原文

I have an HTML table (styles with CSS) that is displayed in a JLabel. I would like the contents (a single, short line of text) of the cells to be both horizontally and vertically centered. Horizontal centering is easy, but I cannot seem to center the text vertically. I've tried vertical-align: and valign: with both middle and center arguments. I've looked at several of the tricks, but none of them seemed doable, and the ones I tried didn't work.

What I have now:

Inline (in the <style> tag) CSS:

table.outer {
    background:#F0F0F0;
    border-collapse:collapse;
    border:none;
}

td.outer {
    border-style:solid;
    border-width:1pt;
    border-color:#888888;
    padding:0pt 0pt 0pt 0pt;
}

table.inner {
    border-collapse:collapse;
    border:none;
}

td.title {
    width:75pt;
    background:#BFBFBF;
    padding:1.5pt 0pt 1.5pt 0pt;
}

The relevant portion of the HTML:

<body bgcolor=#F0F0F0>
<table class='outer'>
  <tr>
    <td class='outer' valign=top>
    <table class='inner'>
      <tr>
        <td class='title' rowspan=3>
          <p class='title'>Current Run</p>
        </td>
      </tr>
    </table>
    </td>
  </tr>
</table>
</body>

分享到QQ

分享到微博