Image
in namespace DotVVM.Framework.Controls.Bootstrap
Renders an image and allows to apply Bootstrap CSS classes.
Usage & Scenarios
Renders an image and allows to apply Bootstrap CSS classes - e.g. rounded corners, circle crop etc.
Sample 1: Basic Image
The most important property is the ImageUrl
which sets the src attribute of the rendered image.
The Image
control has the ToolTip
, AlternateText
, Width
and Height
properties which set the title, alt, width and a height of the image.
The width and height is applied using inline CSS styles.
<bs:Image ImageUrl="~/Images/LA.jpg" AlternateText="Los Angeles"
Height="50%" Width="50%" />
Sample 2: Image Types
The Type
property specifies which type of the image should be rendered.
The available types are:
- Default
- Thumbnail
- Responsive
- Rounded
- Circle
<bs:Image ImageUrl="~/Images/LA.jpg" AlternateText="Los Angeles" />
<br/>
<bs:Image ImageUrl="~/Images/LA.jpg" AlternateText="Los Angeles" Type="Thumbnail" />
<br/>
<bs:Image ImageUrl="~/Images/LA.jpg" AlternateText="Los Angeles" Type="Responsive" />
<br/>
<bs:Image ImageUrl="~/Images/LA.jpg" AlternateText="Los Angeles" Type="Rounded" />
<br/>
<bs:Image ImageUrl="~/Images/LA.jpg" AlternateText="Los Angeles" Type="Circle" />
Properties
Name | Type | Description | Notes | Default Value | |
---|---|---|---|---|---|
AlternateText | String | Gets or sets the alternate text of the image. |
attribute
static value
bindable
|
null | |
Attributes | Dictionary<String,Object> |
attribute
static value
|
null | ||
ClientIDMode | ClientIDMode | Gets or sets the client ID generation algorithm. |
attribute
static value
|
Static | |
DataContext | Object | Gets or sets a data context for the control and its children. All value and command bindings are evaluated in context of this value. |
attribute
static value
bindable
|
null | |
Height | String | Gets or sets the height of the image. |
attribute
static value
bindable
|
null | |
ID | String | Gets or sets the unique control ID. |
attribute
static value
bindable
|
null | |
ImageUrl | String | Gets or sets the URL of the image. |
attribute
static value
bindable
|
null | |
IncludeInPage | Boolean | Gets or sets whether the control is included in the DOM of the page. |
attribute
bindable
|
True | |
InnerText | String | Gets or sets the inner text of the HTML element. |
attribute
static value
bindable
|
null | |
ToolTip | String | Gets or sets the tool tip text of the image. |
attribute
static value
bindable
|
||
Type | ImageType | Gets or sets the type of the image - e.g. rounded, circle, responsive etc. |
attribute
static value
|
Default | |
Visible | Boolean | Gets or sets whether the control is visible. |
attribute
bindable
|
True | |
Width | String | Gets or sets the width of the image. |
attribute
static value
bindable
|
null |