How to set default text color with word highlighting of CodeArea?

I want to color the words which have not yet been colored with word highlightning (patterns etc.) I tried:

CodeArea codeArea = new CodeArea();
codeArea.setId("codearea");

and in .css file

#codearea .text {
    -fx-fill: whitesmoke;
}

but it colors all text in CodeArea Any ideas or help ? Sorry about my bad english 😃 Thanks

[shadychan]

@JordanMartinez I check out all above your answers, but sadly I didn’t solve my problem in the end…

I run the XMLEditor Demo. Actually, I just want to do one thing :

make the background black and the non-highlight text white

So I modified the xml-highlighting.css like :

.text {
    -fx-fill: white;
}

.tagmark {
    -fx-fill: gray;
}
.anytag {
    -fx-fill: orangered;
}
.paren {
    -fx-fill: firebrick;
    -fx-font-weight: bold;
}
.attribute {
    -fx-fill: green;
}
.avalue {
    -fx-fill: green;
}

.comment {
	-fx-fill: mediumpurple;
}

.styled-text-area {
    -fx-background-color: black;
}

It worked, BUT the line numbers became white, too Now I cant see them because its background is grey

How can I solve this problem ? Thanks~

[JordanMartinez]

Actually… #codeArea .text { /* CSS */ } does the same thing as the full string above… I remembered this issue being different from what it actually was.

Forget what I said in my previous comment, @KnightPL. Instead, I found that this will work: Given a CSS file like:

.styled-text-area {
    -fx-background-color: black;
}
#someArea .text {
    -fx-fill: white;
}

#someArea .red {
    -fx-fill: red;
}

and an application like so:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.stage.Stage;
import org.fxmisc.flowless.VirtualizedScrollPane;
import org.fxmisc.richtext.CodeArea;

import java.util.Collections;

public class CssBug extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {

        CodeArea area = new CodeArea("initial text");
        VirtualizedScrollPane<CodeArea> vsPane = new VirtualizedScrollPane<>(area);
        area.setId("someArea");
        area.setStyle(6, area.getLength(), Collections.singleton("red"));

        Scene scene = new Scene(vsPane, 500, 200);
        scene.getStylesheets().addAll(CssBug.class.getResource("css-bug.css").toExternalForm());


        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
            launch(args);
        }
}

I can override the default whitesmoke fill with a red fill.