Blazorise Jumbotron component

Lightweight, flexible component for showcasing hero unit style content.

A lightweight, flexible component that can optionally extend the entire viewport to showcase some special content or information.

  • <Jumbotron> the main container.

    • <JumbotronTitle> required title of the jumbotron.

    • <JumbotronSubtitle> optional subtitle of the jumbotron.

Examples

Basic

Jumbotron is a full width card that is usually displayed at the top of the page, sometimes also referred to as a "Hero component".

The jumbotron color should be only slightly off the background of the page to make your design feel "light".

Hello, world!

This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.

It uses utility classes for typography and spacing to space content out within the larger container. 

<Jumbotron Background="Background.Light" Margin="Margin.Is4.FromBottom">
    <JumbotronTitle Size="JumbotronTitleSize.Is4">Hello, world!</JumbotronTitle>
    <JumbotronSubtitle>
        This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.
    </JumbotronSubtitle>
    <Divider></Divider>
    <Paragraph>
        It uses utility classes for typography and spacing to space content out within the larger container.
    </Paragraph>
</Jumbotron>

API

Parameters

Parameter Description TypeDefault
ChildContent

Defines the content rendered inside the jumbotron.

 RenderFragmentnull
On this page