Server Side

Component reference

There are many ways to reference components, please refer to Installation

.NET CLI
dotnet add package BootstrapBlazor --version 5.12.2
CSS file

Add the Bootstrap CSS file in the form of <link> tags to the Pages/_Host.cshtml file <head> tags, and place them in all Before other style sheets.

<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="_content/BootstrapBlazor/css/bootstrap.blazor.bundle.min.css" rel="stylesheet">
JS file

Many components provided by Bootstrap rely on JavaScript to run. Specifically, these components rely on jQuery, Popper.js, and our own JavaScript plug-ins. Put the following <script> tag at the end of the Pages/_Host.cshtml file and before the </body> tag, it will work.

<script src="_content/BootstrapBlazor/js/bootstrap.blazor.bundle.min.js"></script>

Add the namespace to the _Imports.razor file

@using BootstrapBlazor.Components

Registration Service

public void ConfigureServices(IServiceCollection services)
{
    services.AddRazorPages();
    services.AddServerSideBlazor();

    // Add this line of code
    services.AddBootstrapBlazor(); 
}

Use components

Reference the BootstrapBlazor component in the razor component

<Button Color='Color.Primary'>Button</Button>
Themes
Bootstrap
Ant Design (完善中)
Bluma (完善中)
LayUI (完善中)
Motronic (已集成)
An error has occurred. This application may no longer respond until reloaded. Reload