Change Theme Settings
Change Theme Settings
Themes
 
Show All Themes
v
...v

Button

Cancel
RenderMode = Button
Text = "Cancel"
Images.Image.IconID = IconID.ActionsCancel16x16
Refresh
RenderMode = Link
Text = "Refresh"
Images.Image.IconID = IconID.ActionsRefresh16x16gray
ImagePosition = Right
Styles.Native = true
Text = "OK"
Send a message
EnableTheming = false
Text = "Send a message"
Images.Image.Url = "Images/Icq.png"
ImagePosition = Right
ControlStyle.CssClass = "icq"
Styles.Style.HoverStyle.CssClass = "icqHovered"
Styles.Style.PressedStyle.CssClass = "icqPressed"
Submit
EnableTheming = false
Text = "Submit"
ControlStyle.CssClass = "wine"
Styles.Style.HoverStyle.CssClass = "wineHottracked"
Styles.Style.PressedStyle.CssClass = "winePressed"
EnableTheming = false
RenderMode = Link
Images.Image.SpriteProperties.CssClass = "blueBall"
Images.Image.SpriteProperties.HottrackedCssClass = "blueBallHottracked"
Images.Image.SpriteProperties.PressedCssClass = "blueBallPressed"


This demo illustrates how the DevExpress ASP.NET MVC Button extension's appearance can be customized in different ways.

The Button content can consist of text and an image. The button text can be specified by the Text property. A button image is determined by the Images.Image property, and is displayed next to the text at the position specified by the ImagePosition property.

The easiest way to change the Button appearance is to apply a DevExpress theme. In this demo, a theme applied to the buttons can be specified using the THEMES link in the top-right corner.

Button provides the RenderMode property, which specifies which element is used to render the button: a div element (the Button value) or a hyperlink (the Link value). Additionally, the Button extension can be rendered as a native input element if the Styles.Native property is set to true.

To provide the Button extension with a custom appearance, disable the DevExpress theming mechanism by setting the EnableTheming property to false. Thereafter, you can modify every button element's appearance using the style properties provided by the extension, or by specifying the custom CSS class that is applied to the extension.