MASABlazor在移动端点击保持出现悬停样式

提出问题

最近在学习MAUIBlazor，用的MASA Blazor，发现在移动端（触屏设备）上，点击会一直显示悬停样式，如下图所示，简单研究了一下，发现这是移动端的通病。

解决问题

MASABlazor中的悬停效果一般都是用::before实现的，所以理论上只要判断在移动端，并且在悬停时把::before的样式改为display:none;就可以了。
但是在实际上MASABlazor中图标也是用::before实现的，所以图标的样式应为为display:inline-block，这样就不会受到干扰了

@media (hover: none) {
    *:hover *::before{
        display:none;
    }
    *:hover i::before {
        display:inline-block
    }
}