When you click a term in the glossary, the selected term is highlighted by a gray background. With some changes, you can style the highlight any way you like. To do this, you have to modify your output files. This means that you need to copy the modified files in your output every time you generate your project.
Note:
- This article shows how to highlight search results in the search pane. If you want to change the highlight of search results in topics, go to Highlighting search results.
- The highlight function for every menu (glossary, toc, index and search) is a little different.
You can style the highlight the easy way, or the hard way. When you choose the hard way, you will have to change the javascript that sets the font (sStyle and setFont) in whfbody.htm and whfform.htm. You have to set the font in three different places: if you change only whfbody.htm and the function writeFormStyle in whfform.htm, it will not work. There's another style definition at the bottom of whfform.htm.
The easy way is to attach a style sheet to both whfbody.htm and whfform.htm. In this style sheet, add styling for the tag a. This will style all the topic titles. For the highlight, define the pseudo-classes a:active and a:focus. Just don't forget the !important-property if your style doesn't take effect. You probably need to overwrite the styles from the javascript. You're styles may look something like this:
a {
display: block !important;
text-decoration: none !important;
outline: none !important;
}
a:active, a:focus {
color: #fff !important;
background-color: #849AE7 !important;
font-weight: bold !important;
}