英文:
How to align text with image (<img>) in a table cell (<td>) in HTML 3.2
问题
很抱歉，Swing仅支持HTML 3.2。我尝试实现的目标是这样的：
但是我无法实现。无论我做什么，文本（sometext）和图像之间都没有对齐。
我尝试过所有组合：align='middle' align='top' align='bottom' 在 <td> 标签内和 <img> 标签内。我也尝试过使用 valign。
以下是Java示例，以便您测试是否在Swing中有效：
public class HtmlExample {
public static void main(String[] args) {
//@formatter:off
SwingUtilities.invokeLater(() -> {
String prefix = "<html><body><table border='1'><tr>";
String suffix = "</tr></table><body><html>";
StringBuilder sb = new StringBuilder(prefix);
sb.append("<td style='width:50%'>");
sb.append("<img src=\"https://www.w3schools.com/images/stickman.gif\" align='top' width=\"24\" height=\"24\">");
sb.append("sometext");
sb.append("</td>");
sb.append("<td style='width:50%'>");
sb.append("something");
sb.append("</td>");
sb.append(suffix);
JLabel label = new JLabel(sb.toString());
JOptionPane.showMessageDialog(null, label);
});
}
}
我尝试了HTML 3.2参考规范中提到的很多方法，但都没有得到我想要的效果。
如果我这样做：
我接近了所需的效果。但是这在HTML 3.2中不起作用。
编辑：（在@Frakcool提到使用JTable之后）
我不使用JTable的原因是我使用文本作为工具提示，如此答案中所述。
英文:
Unfortunately, Swing supports HTML 3.2. What I am trying to achieve is this:
But I am unable too. No matter what I do there is no alignment between the text (sometext) and the image.
I have tried all combinations of: align='middle' align='top' align='bottom' inside <td> tag and inside <img> tag. I have tried with valign as well.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-html -->
<html>
<body>
<table border="1" >
<tr>
<td style='width:50%'>
<img src="https://www.w3schools.com/images/stickman.gif" align='middle' width="24" height="24">
sometext
</td>
<td style="width:50%">something</td>
</tr>
</table>
</body>
</html>
<!-- end snippet -->
What I get are things like:
Is there a way to achieve it?
The Java example in case you want to test if it works in Swing:
public class HtmlExample {
public static void main(String[] args) {
//@formatter:off
SwingUtilities.invokeLater(() -> {
String prefix = "<html><body><table border='1'><tr>";
String suffix = "</tr></table><body><html>";
StringBuilder sb = new StringBuilder(prefix);
sb.append("<td style='width:50%'>");
sb.append("<img src=\"https://www.w3schools.com/images/stickman.gif\" align='top' width=\"24\" height=\"24\">");
sb.append("sometext");
sb.append("</td>");
sb.append("<td style='width:50%'>");
sb.append("something");
sb.append("</td>");
sb.append(suffix);
JLabel label = new JLabel(sb.toString());
JOptionPane.showMessageDialog(null, label);
});
}
}
I have tried a lot of things mentioned in HTML 3.2 Reference Specification but none of them give me what I want.
If I do this:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-html -->
<html>
<body>
<table border="1" >
<tr style=''>
<td style='width:50%;'>
<div>
<img style="vertical-align:middle" src="https://www.w3schools.com/images/stickman.gif" width="24" height="24">
<span>Works.</span>
</div>
</td>
<td style="width:50%">
<div>
<span>Works.</span>
</div>
</td>
</tr>
</table>
</body>
</html>
<!-- end snippet -->
I come close to it. But this will not work in HTML 3.2
EDIT: (After @Frakcool made a point of using a JTable)
The reason I do not use a JTable is that I use the text for a tooltip. As mentioned in this answer.
答案1
得分: 3
HTML 3.2 中没有 style 属性。您唯一的希望是嵌套表格，像这样：
<table border="1">
<tr>
<td>
<table>
<tr>
<td>
<img src="https://www.w3schools.com/images/stickman.gif" align="middle" width="24" height="24">
</td>
<td>
sometext
</td>
</tr>
</table>
</td>
<td>something</td>
</tr>
</table>
英文:
First. there's no style attribute in HTML 3.2. Your only hope is to nest tables, like this:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-html -->
<table border="1" >
<tr>
<td>
<table>
<tr>
<td>
<img src="https://www.w3schools.com/images/stickman.gif" align='middle' width="24" height="24">
</td>
<td>
sometext
</td>
</tr>
</table>
</td>
<td>something</td>
</tr>
</table>
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论