Styles

Contained style:
Outline style:
Text style:
Disabled:

This demo illustrates the DevExpress Blazor Button component with different styles and options. The main Button API members are listed below:

  • Text — Specifies the text within the button.
  • RenderStyle — Specifies the button's render style.
  • RenderStyleMode — Specifies how to apply the render style to the button.
  • Click — Occurs after the button is clicked.
  • Enabled — Enables/disables the button. The disabled button (Enabled is set to false) does not respond to user actions.

The Button component supports different size modes. To specify the component's size in code, use the SizeMode property. To apply different size modes, use the drop-down list in the demo card's header.

 Icons

This demo illustrates how to display an icon in the Button component.

  • IconCssClass — Specifies the name of the icon's CSS class.
  • IconPosition — Specifies the icon's position relative to the text.

The demo also shows how to use the Title HTML attribute to display a tooltip text when the mouse moves over the button.

 Custom Content

This demo illustrates how to customize the Button's appearance and content.