Example: Change the Panel Header Style

You can change the look-and-feel of the panel header title by overriding the “dht” style:

/* existing definition in BaseStyles.css */

.dht { /* panel header title text */

color: #666666;

font-family: Verdana, Geneva, ms sans serif;

font-size: 11px;

font-weight: bold;

padding-top: 1px;

text-align: left;

text-transform: uppercase;

vertical-align: middle;

}

This renders as:

Let’s change the title’s “color” to green, its “font family” to Times, increase its “font size” by two pixels, and render its characters in normal capitalization:

/* new definition in Styles.css */

.dht { /* panel header title text */

color: #229922; /* override default attribute */

font-family: Times, ms sans serif; /* override default attribute */

font-size: 12px; /* override default attribute */

text-transform: none; /* override default attribute */

}

The figure shows the effect of the newly added “dht” definition in Styles.css, with the original attributes overridden, e.g., “color” changed to green,” font family” changed to Times,” font size” changed to 12px, and “text transform” changed to normal capitalization.

Example: Change the Panel Header Style

See Also