MASABlazor在移动端点击保持出现悬停样式
提出问题
最近在学习MAUIBlazor,用的MASA Blazor,发现在移动端(触屏设备)上,点击会一直显示悬停样式,如下图所示,简单研究了一下,发现这是移动端的通病。
解决问题
MASABlazor中的悬停效果一般都是用::before实现的,所以理论上只要判断在移动端,并且在悬停时把::before的样式改为display:none;
就可以了。
但是在实际上MASABlazor中图标也是用::before实现的,所以图标的样式应为为display:inline-block
,这样就不会受到干扰了
@media (hover: none) {
button:hover::before{
display:none;
}
.m-icon:hover::before {
display:inline-block
}
}
分类:
Blazor
标签:
Blazor
, MAUIBlazor
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· .NET10 - 预览版1新功能体验(一)