Enterprise-level component library based on Bootstrap and Blazor

star nuget master download license repo commit

Popover 弹出窗组件

点击/鼠标移入元素,弹出气泡式的卡片浮层

点击文本输入框弹出 Popover 弹出框,Placement 设置弹出框的位置 二次点击时关闭弹出框

Demo

点击按钮后弹出 Popover 弹出框

Demo

Attributes

Loading...
@page "/popovers"

<h3>Popover 弹出窗组件</h3>

<h4>点击/鼠标移入元素,弹出气泡式的卡片浮层</h4>

<Block Title="基础用法" Introduction=" 点击文本输入框弹出 Popover 弹出框,<code>Placement</code> 设置弹出框的位置 二次点击时关闭弹出框">
    <div class="d-flex flex-column w-100 popover-demo">
        <div class="d-flex justify-content-center">
            <BootstrapInput Value="@ValueString">
                <Popover Placement="Placement.Bottom" Title="@Title" Content="@Content" IsHtml="true" />
            </BootstrapInput>
        </div>
        <div class="d-flex justify-content-between align-items-center flex-fill">
            <BootstrapInput Value="@ValueString">
                <Popover Placement="Placement.Right" Title="@Title" Content="@Content" IsHtml="true" />
            </BootstrapInput>
            <BootstrapInput Value="@ValueString">
                <Popover Placement="Placement.Left" Title="@Title" Content="@Content" IsHtml="true" />
            </BootstrapInput>
        </div>
        <div class="d-flex justify-content-center">
            <BootstrapInput Value="@ValueString">
                <Popover Placement="Placement.Top" Title="@Title" Content="@Content" IsHtml="true" />
            </BootstrapInput>
        </div>
    </div>
</Block>

<Block Title="Popover 按钮激活弹出框" Introduction="点击按钮后弹出 Popover 弹出框">
    <Button>
        <span>Click 激活/关闭</span>
        <Popover Placement="Placement.Auto" Title="@Title" Content="@Content" IsHtml="true" Trigger="click" />
    </Button>
</Block>

<AttributeTable Items="@GetAttributes()" />
网络错误

B 站相关视频链接

暂无

交流群

QQ Group:BootstrapAdmin & Blazor 795206915( Full) 675147445 Welcome to join the group discussion
Themes
Bootstrap
Ant Design (完善中)
Bluma (完善中)
LayUI (完善中)
Motronic (已集成)
An error has occurred. This application may no longer respond until reloaded. Reload