javascript - HTML/CSS : How to make multiple 'versions' of an 'article' for different types of articles

Question

我用 Java 制作了一个聊天应用程序，并在前端使用了 javascript、HTML 和 CSS。对于应用程序，您可以发送公共(public)或私有(private)消息。 javascript 从文本框中抓取消息并将其发送到服务器，然后服务器从中生成 HTML 消息并将其作为呈现的文章返回。

我想让公共(public)和私有(private)消息以不同的颜色显示，以便于区分它们。

这是被调用以呈现公共(public)消息的函数:

   private static String createHtmlMessageFromSender(String sender, String message) {
        return article(
                b(sender + " says:"),
                span(attrs(".timestamp"), new SimpleDateFormat("HH:mm:ss").format(new Date())),
                p(message)
        ).render();
    }

这个被调用来呈现私有(private)消息:

private static String createHtmlMessageFromSenderPrivate(String sender, String message) {
    return article(
            b(sender + " says to you:"),
            span(attrs(".timestamp"), new SimpleDateFormat("HH:mm:ss").format(new Date())),
            p(message)
    ).render();
}

我对 HTML 和 CSS 还很陌生。私有(private)和公共(public)消息都被呈现为“文章”并放入名为“聊天”的 div 对象中。我不知道是否可以在我的 CSS 文件中制作两个不同的“#chat article”“版本”，以便它可以具有一种用于私有(private)消息的样式和一种用于公共(public)消息的样式。这似乎是一件很常见的事情，但我找不到相关信息。谢谢。

Answer 1

不是 Java 专家，但听起来您想给每个要渲染的新节点一个类，并像这样在 CSS 中设置样式:

.firstClassName {
    color: red;
}

.secondClassName {
    color: blue;
}