图像在jediorpane中对齐html

时间:2015-11-27 18:17:47

标签: java html jeditorpane

我现在正在使用jEditorPane,我需要在图片的右上角对齐文字,尽管有一个html标记,用于align =" left"在我的图像中,我仍然在照片的右下角收到文字。我知道jEditorPane只支持高达3.2的HTML,但我检查并确保自HTML 1.0以来一直使用对齐标记

期望的输出:

desired output

当前输出:

current output

这里有一个代码片段以获取更多信息,其中output是已添加到框架中的已定义的jEditorPane(设置为使用html):

output.setText("<img src=\"https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png\" alt=\"profile picture\" width=\"60\" height=\"60\" align=\"left\"/>\r\n\r\n<font face=\"tahoma\" size=\"3\">\r\n\r\n<b>username</b>\r\n\r\n<font face=\"tahoma\" size=\"2.5\">\r\n<br>\r\n    \"blah blah blah\" \r\n<br>\r\n    \"blah blah blah\" \r\n<br>\r\n    \"blah blah blah\" \r\n</p>\r\n</br>\r\n<hr>");

html格式的文字:

&#13;
&#13;
<img src= "https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt= "profile picture" width= "60" height= "60" align= "left"/>

<font face= "tahoma" size= "3">
  
  <b>username</b>
  
  <font face="tahoma" size="2.5">
    <br>
    "blah blah blah" 
    <br>
    "blah blah blah" 
    <br>
    "blah blah blah" 
    </p>
  </br>
<hr>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

如果我是正确的话,在文本上设置vertical-align: text-top;应该有效。

编辑;或者在JS object.style.verticalAlign="top"

答案 1 :(得分:0)

我不完全确定jEditorPane是如何工作的,但如果它只是输出HTML,你不应该关心jEditorPane支持什么,但是浏览器支持什么。根据我的评论,并假设您可以(并且应该?)使用HTML5,但必须使用内联样式,我就这样做。

&#13;
&#13;
<div>
    <img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt="profile picture" width="60" height="60">
<span style="font-weight:bold;margin-left:12px">username</span>
</div>

<div style="margin-top:12px">
    <!-- Instead of small you could also use font-size -->
    <small>
        blah blah blah<br>blah blah blah
    </small>
</div>
&#13;
&#13;
&#13;

在Java中,然后使用单引号作为包装,并在HTML字符串中使用双引号:

output.setText('<div><img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt="profile picture" width="60" height="60"><span style="font-weight:bold;margin-left:12px">username</span></div><div style="margin-top:12px"><small>blah blah blah<br>blah blah blah</small></div>');