Style Editor: Font Panel

See Also

This panel of the the Style Editor enables you to choose font-related cascading style sheet (CSS) declarations to the style property of a JavaServer Faces component. The declarations you add to the style property override corresponding CSS rules defined in the page's CSS file.

The Font panel enables you to set the following style declarations:

• Font Family. Sets the CSS property font-family. When the page is rendered, the browser attempts to apply the specific font or a font derived from the font families specified in this property from left to right on the user's system, comparing each specified font with the fonts installed on the system until it finds a match. You can choose a font or set of fonts from the list, or you can click the Edit button and add fonts by using the Edit Font Families dialog box.
   
  
• Size. Sets the CSS property font-size, which specifies how large the font is to be rendered. You can choose a value from the list below the field, or you can enter a numeric value directly. After setting the size, you can choose the units from the drop-down list on the right.
   
  
• Style. Sets the CSS property font-style, which specifies if the font is rendered normally or in its italic or oblique version. Not all fonts have an italic style. Typically, italic and oblique are rendered the same.
   
  
• Weight. Sets the CSS property font-size, which typically specifies if the font is or is not bold. Some fonts also support the bolder and lighter settings available from the drop-down list.
   
  
• Variant. Sets the CSS property font-variant, which specifies if the font is to be rendered in small caps.
   
  
• Color. Sets the CSS property font-color, the color in which the font is rendered. You can:
  • Choose one of the standard colors from the drop-down list.
     
    
  • Click the color box to the right of the field and pick a color
     
    
  • Enter a hexadecimal RGB color value prefixed with a hash mark (#) or use the decimal notation rgb(red-value,green-value,blue-value). For example, the value for white is rgb(255,255,255).
     
    

  The following table shows the standard colors:

  
   
  

• Color names and sRGB values
  	black = "#000000"		green = "#008000"
  	silver = "#C0C0C0"		lime = "#00FF00"
  	gray = "#808080"		olive = "#808000"
  	white = "#FFFFFF"		yellow = "#FFFF00"
  	maroon = "#800000"		navy = "#000080"
  	red = "#FF0000"		blue = "#0000FF"
  	purple = "#800080"		teal = "#008080"
  	fuchsia = "#FF00FF"		aqua = "#00FFFF"

  
   
  
• Decoration. Sets the CSS property text-decoration, which adds an underline, overline, strikethrough (line-through), or no decoration (none) to the text. Since the settings are checkboxes, you can add more than one decoration at a time.
   
  

See Also

About Components

Common Component Properties

Using Cascading Style Sheets