使用 ASP.NET Blazor 和 Blazorise，我如何使用它仅在移动设备上显示内容？答案

【问题标题】：With ASP.NET Blazor and Blazorise, how do I use that to show content only on mobile?使用 ASP.NET Blazor 和 Blazorise，我如何使用它仅在移动设备上显示内容？
【发布时间】：2021-05-29 00:35:17
【问题描述】：

Same question 没有我喜欢的答案.... 并且由于以下内容允许我仅在桌面环境中显示 Container 的内容。

    <Container Display="Display.None.Block.OnFullHD">
        <AppHelpMenu />
    </Container>

如何使用它仅在移动设备上显示容器？

    <Container Display="Display.None.Block.Mobile">
        <AppHelpMenu />
    </Container>

这不起作用:(

【问题讨论】：

标签： xaml blazor blazorise

【解决方案1】：

下面的 CSS 效果很好

@media (min-width: 641px) {
    .show-mobile-only {
        /* don't show on mobile */
        display: none;
    }

<div class="show-mobile-only" >
    <NavHelp />
</div>

【讨论】：

虽然我找到了一些可以使用 Display.Blah 的东西，但它会更干净、更耀眼。

【解决方案2】：

应该是

<Container Display="Display.None.OnFullHD.None.OnTablet.Block.OnMobile">
    <NavHelp />
</Container>

首先，您定义如何显示 (None)，然后定义显示位置 (OnMobile)。

【讨论】：

我用对我有用的方法编辑了你的答案，但它如何工作的描述是完美的。谢谢！