Defining the Appearance of Links
You can customize the appearance of links, also known as hyperlinks and hypertext links. You can define the color and text decoration, such as underline, for the currently selected link (active link), links you have previously visited, links you hover over, and the links you have not previously visited. These link settings are stored in the webworks.css
file. You can create an override for the webworks.css
file and then modify the tags that define the links.
Note: These changes do not affect output formats that do not use cascading style sheets.
In your source files, apply a character style to identify the text to include in each link. The character style can also affect the appearance of the link.
To change the color of links
1. In your Stationery design project, go to Advanced menu bar item and either click
Manage Format Customizations or Manage Target Customizations.
2. Navigate to Pages\css
in this window.
3. Double click the webworks.css
file and it will be bolded to indicate that a customization has been created.
4. Double click again, and the CSS file should be opened in a text editor:
5. Find the following code and modify the values specified within the braces:
a:link:active { color: #0000CC }
a:link:hover { color: #CC0033 }
a:link { color: #3366CC }
a:visited { color: #9999CC }
To modify the text color, specify the desired RGB color value for the
color
option of the appropriate link type and state.
To add text decoration, such as an underline, add the
text-decoration: underline;
option to the type of link you want to have an underline, and add the
text-decoration: none;
option to the other types of link.
To make the link text bold when you hover over the link, add the
font-weight: bold;
option to the
a:link:hover
definition.
6. Save the webworks.css
file.
7. Save and close your project.
8. Reopen your project and regenerate to review the changes.
Last modified date: 06/11/2024