CODEWITHSUNDEEP
htmlcss
seuvitor
seuvitor

Reputation: 289

Is there a way to use CSS to highlight keywords?

Well, that's the context: I am editing a latex source file in google docs, and I wonder if I could use CSS to color arbitrary keywords and text enclosed in dollar signs.

For example, given this HTML file:

<html><body>
\section{Heading 1}
<br>
This is a simple file with a formula $x_1 = x_0 + 1$.
<br>
Here it ends \cite{somebody}.
</body></html>

I wanted CSS to let me see this:

\section{Heading 1}
This is a simple file with a formula $x_1 = x_0 + 1$.
Here it ends \cite{somebody}.

I assume it can't be done, since there is no markup isolating these constructs I want to format.

Cheers.

EDIT: Seems like the sample output is not colored as I intended, although it is in the edit view.

Upvotes: 3

Views: 1772

Answers (3)

tardate
tardate

Reputation: 16774

As noted by Arve and Gary, I don't think a pure-CSS solution is possible.

However, if you are able to use javascript in your context is is possible. I am using SyntaxHighlighter by Alex Gorbatchev for syntax highlighting tasks. I would recommend it as long as the kind of style that SyntaxHighlighter can produce fits your needs.

There is some work to do however. It uses a "brush" plugin architecture, and although there is no brush defined for latex it should be quicker to create a brush than build a syntax highlighting solution from scratch.

Upvotes: 0

Arve Systad
Arve Systad

Reputation: 5479

You'd need to insert a span-element to wrap around those bits you want highlighted, then style them with a different background color or something else.

So no, a pure CSS-based sollution is impossible.

Upvotes: 4

Gary Green
Gary Green

Reputation: 22395

Your correct. There is no way to do this in CSS alone. Doing so in Javascript however would be quite trivial.

Upvotes: 3

Related Questions