Highlight

Design

Highlights are used to differentiate a word or part of a word from the text around it. The main use case is to highlight search terms in a page of search results.

There are two types of highlight in ACE: whole word and partial word (substring).

Whole word is used to highlight a match of a complete word; substring is used when only part of the word matches the search term.

Search: "quick"

The quick brown fox.

Search: "eet"

The fleet feet on the street.

Code

API: stable
Example Element Code
Default Default highlight, whole word lozenge style.
<span class="ace-highlight">Default</span>

                                                                          <% ace.Highlight(Array("text", "Default")) %>
                                                                          
Substring Substring highlight.
<span class="ace-highlight ace-highlight-substring">Sub</span>string

                                                                          <% ace.Button(Array(_
                                                                              "text", "Substring",_
                                                                              "type", "substring"_
                                                                          )) %>