When you build a Fancy Button, you have the option to configure the Text Styles.
There are two Text Style view states:
- Normal: State of the Fancy Button text when not hovered over
- Hover: State of the Fancy Button text when hovered over
There are two tabs that help you modify your Text Styles:
- Text: Modify font family, style, color, size, alignment, and underline options
- Advanced (Adv.) Styles: Use HTML to create further specifications for text, hover, focus, and active display styles
- Normal/Hover: Normal edits the default view of the button, Hover edits the hover state of the button
- Font Family: Choose a font
- Style: Choose a style
- Note: You must choose a font first before you can choose a style. This is because the style options depend on the font family you choose.
- Color: Choose a color with the drop-down
- Size: Specify the size in em units
- Alignment: Choose to align text left, right, or center
- Underline: Select to mark text as underlined
- Note: Text Shadows are supported by modern browsers (like the one you are currently using), but in IE9 or below they will not display.
- Color: Select a shadow color from the drop-down
- Blur Radius: Choose how much, in px units, to blur the shadow
- Offset X: Horizontal shadow offset; a positive value puts the shadow on the right side of the box, and a negative value puts the shadow on the left side of the box
- Offset Y: Vertical shadow offset; a positive value puts the shadow below the box, and a negative value puts the shadow above the box
- Choose to customize, in HTML, display specifications for different actions (how the text will appear when hovered over, focused, active, etc).
Feedback About the ArticleLet us know what was helpful or not helpful about the article below.
What about adding New Text Styles? How do you configure your fancy button to include those instead of the Default Text Style?
Please sign in to leave a comment.