Skip to content

Latest commit

 

History

History

highlight-keywords

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
title description owner noCSS
Highlight Keywords
Adds special CSS classes for each keyword for fine-grained highlighting.
vkbansal
true
<style> /* * Custom keyword styles */ .token.keyword.keyword-return, .token.keyword.keyword-if { /* Set the color to a nice red. */ color: #f92672; } </style>

How to use

This plugin adds a special class for every keyword, so keyword-specific styles can be applied. These special classes allow for fine-grained control over the appearance of keywords using your own CSS rules.

For example, the keyword if will have the class keyword-if added. A CSS rule used to apply special highlighting could look like this:

.token.keyword.keyword-if { /* styles for 'if' */ }

Note: This plugin does not come with CSS styles. You have to define the keyword-specific CSS rules yourself.

Examples

This example shows the plugin in action. The keywords if and return will be highlighted in red. The color of all other keywords will be determined by the current theme. The CSS rules used to implement the keyword-specific highlighting can be seen in the HTML file below.

JavaScript


HTML (Markup)