Bootstrap card component.
A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options.
Some quick example text to build on the card title and make up the bulk of the card's content.
Cards support a wide variety of content, including images, text, list groups, links, and more. Below are examples of what’s supported.
Some quick example text to build on the card title and make up the bulk of the card's content.
Card link Another linkWith supporting text below as a natural lead-in to additional content.
With supporting text below as a natural lead-in to additional content.
With <HxTabPanel RenderMode="TabPanelRenderMode.Card">
, the tab navigation is placed in the card header and tab contents go into the card body.
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
Last updated 3 mins ago
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
Last updated 3 mins ago
Create lists of content in a card with a flush list group.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Name | Type | Description |
---|---|---|
AdditionalAttributes | Dictionary<string, object> |
Additional attributes to be splatted onto an underlying HTML element. |
BodyCssClass | string |
Additional CSS class for the body. |
BodyTemplate | RenderFragment |
Body content. |
ChildContent | RenderFragment |
Generic card content (outside .card-body ). |
CssClass | string |
Additional CSS classes for the card-container. |
FooterCssClass | string |
Additional CSS class for the footer. |
FooterTemplate | RenderFragment |
Footer content. |
HeaderCssClass | string |
Additional CSS class for the header. |
HeaderTemplate | RenderFragment |
Header content. |
ImageAlt | string |
Image alt attribute value. |
ImageHeight | int? |
Image height attribute value. |
ImagePlacement | CardImagePlacement |
Placement of the image. Default is CardImagePlacement.Top . |
ImageSrc | string |
Image to be placed in the card. For image position see ImagePlacement . |
ImageWidth | int? |
Image width attribute value. |
Settings | CardSettings |
Set of settings to be applied to the component instance (overrides HxCard.Defaults , overridden by individual parameters). |
Property | Type | Description |
---|---|---|
Defaults | CardSettings |
Application-wide defaults for HxCard and derived components. |
Bootstrap card-title component.
Name | Type | Description |
---|---|---|
ChildContent | RenderFragment |
Text content. |
CssClass | string |
Additional CSS class(es) for the card-text element. |
Bootstrap card-title component.
Name | Type | Description |
---|---|---|
AdditionalAttributes | Dictionary<string, object> |
Additional attributes to be splatted onto an underlying HTML element. |
ChildContent | RenderFragment |
Text content. |
CssClass | string |
Additional CSS class(es) for the card-title element. |
HtmlElement | string |
Underlying HTML element for card-title. Default is h5 . |
Bootstrap card-subtitle component.
Name | Type | Description |
---|---|---|
AdditionalAttributes | Dictionary<string, object> |
Additional attributes to be splatted onto an underlying HTML element. |
ChildContent | RenderFragment |
Text content. |
CssClass | string |
Additional CSS class(es) for the card-subtitle element. |
HtmlElement | string |
Underlying HTML element for card-subtitle. Default is h6 . |