在 Java 中使用 HTMLEditorKit，<img> 標簽忽略了我的 CSS styles （但文本接受 styles 就好了）

Question

好的，所以我正在使用 HTMLEditorKit 構建 Java 中的“聊天窗口”。 一般的方法是我首先使用 StyleSheet.addRule() 構建樣式表。 我建立的樣式表是：

body  {color:#ff00ff; font-family:SansSerif; font-size:12pt;}
p     {color:#ff00ff; font-family:SansSerif; font-size:12pt;}
.msg  {color:#ff00ff; font-family:SansSerif; font-size:12pt;}
.csa  {color:#ff0000; font-family:SansSerif; font-size:12pt;}
.usa  {color:#0000ff; font-family:SansSerif; font-size:12pt;}
.icon {width:16px; height:16px; object-position:0 5px; }

然后，當我有一個想要應用的聊天行時，我將它放在一個 div 中並將其添加到 JTextPane：

try {       
  kit.insertHTML(doc, doc.getLength(), "\n<div class="+style+">" + s + "</div>", 0, 0, null);                   
} catch (BadLocationException ble) {
  ErrorDialog.bug(ble);           
} catch (IOException ex) {
  ErrorDialog.bug(ex);            
}
conversation.update(conversation.getGraphics()); //Force update of graphics

到目前為止，這一切都很好，下一步。 存在希望能夠在文本中添加小圖像的問題。

添加圖像本身也很好，只要我堅持 html 屬性，例如：

<img src="dice.png" width="16" height="16">

但是，一旦我嘗試做以下兩件事中的任何一個，它就會忽略我所有的樣式：

<img src="dice.png" class="icon">

<img src="dice.png" style="{width:16px; height:16px; object-position:0 5px; }">

我嘗試了各種解決方法，包括跨度標簽，我嘗試了 id 樣式（例如#icon 和 id="icon"），單獨的 div 等。不高興！

這是在相當舊版本的 Java (1.8) 下運行的一些遺留軟件的附加組件，所以我總是“期待最壞的情況”，但正如我所說的所有其他CSS 樣式元素（就文本和布局而言） go) 工作正常。 尋找任何故障排除提示，或者是否存在某種特殊的 HTMLEditorKit 圖像限制（但只要我堅持使用 html 屬性而不是 CSS，我的所有圖像都可以正常工作，但我所有的 Z2C56C36058420D29317 都可以正常工作） 非常感謝您的幫助。

Answer 1

嘗試將圖像設置為display: block或display:inline-block 。 可能不支持inline-block 。 如果圖像是display: inline ，則 height 和 width 屬性不會影響圖像。 還建議僅設置寬度以保持縱橫比。

 .icon1 { width: 100px; height: 100px; display: block; }.icon2 { width: 110px; height: 110px; display: inline-block; }.icon3 { width: 120px; display: block; } /* extra styles for example */ img { margin: 4px; }

 <div class="wrap"> <,-- div not required: just to wrap image in this example --> <img src="https.//placekitten:com/130/130" class="icon1"> <img src="https.//placekitten:com/128/128" class="icon2"> <img src="https.//placekitten.com/132/132" class="icon3"> </div>

編輯：

如果您設置 div 的高度和寬度，則使用帶有background-image: url(path/to/image/file)設置的背景圖像的 div 可能會起作用。