提出问题

最近在学习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
}
}

MASABlazor在移动端点击保持出现悬停样式的更多相关文章

  1. 后台找到repeater里面的div并添加客户端点击事件

    public partial class Inv_SelectWorkservice : System.Web.UI.Page,IPostBackEventHandler{ } 通过OnItemCre ...

  2. 取消a标签在移动端点击时的背景颜色

    一.取消a标签在移动端点击时的蓝色 -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-user-select: none; -m ...

  3. 移动端点击事件300ms延迟问题解决方案——fastclick.js

    移动端点击事件300ms延迟的问题由来已久,如下截图 下面截图来自原文:https://www.jianshu.com/p/6e2b68a93c88 网上关于300ms延迟问题的解决方法,大致分为 3 ...

  4. 取消a标签或者onclick在移动端点击时的背景颜色

    一.取消a标签在移动端点击时的蓝色 -webkit-tap-highlight-color: rgba(, , , ); -webkit-user-select: none; -moz-user-fo ...

  5. 移动端点击300ms延迟

    转载自:http://www.jianshu.com/p/6e2b68a93c88 一.移动端300ms点击延迟 一般情况下,如果没有经过特殊处理,移动端浏览器在派发点击事件的时候,通常会出现300m ...

  6. 怎么去除移动端点击a标签链接时的背景色

    在手机端点击链接时会发现有一个背景色,有时候需要改变这个颜色,或者去除这个颜色,有时候a标签做成按钮时这个颜色的存在会很丑,像这样: 可以通过 -webkit-tap-highlight-color: ...

  7. Bootstrap学习笔记(5)--实现Bootstrap导航条可点击和鼠标悬停显示下拉菜单

    实现Bootstrap导航条可点击和鼠标悬停显示下拉菜单 微笑的鱼 2014-01-03 Bootstrap 5,281 次围观 11条评论 使用Bootstrap导航条组件时,如果你的导航条带有下拉 ...

  8. 在IOS端点击数字后会调起系统拨号界面

    在IOS端点击数字后会调起系统拨号界面,解决方案: <meta name="format-detection" content="telephone=no" ...

  9. css取消a标签在移动端点击时的背景颜色

    一.取消a标签在移动端点击时的蓝色 -webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-user-select: none;-moz ...

  10. 微信公众号使用vue,安卓端点击按钮404,ios访问正常问题

    情景:微信公众号使用vue开发的单页面,在安卓端点击按钮访问显示404,ios访问正常问题,能正常显示. 解决:将微信公众号菜单按钮设置的路径中把WWW去掉后,安卓.ios都能正常访问. 问题路径ww ...

随机推荐

  1. 33-module

    const { resolve } = require('path') const HtmlWebpackPlugin = require('html-webpack-plugin') module. ...

  2. C# 监听窗口分辨率/DPI变更

    当程序运行,窗口已经加载后,如果修改屏幕分辨率,会影响窗口的正常显示. 举个案例: 悬浮窗口,显示在屏幕右下角.当分辨率.文本显示比例变更后,窗口位置可能会超出屏幕范围. 所以当屏幕变更时,我们需要知 ...

  3. 文盘Rust -- rust连接oss

    作者:京东科技 贾世闻 对象存储是云的基础组件之一,各大云厂商都有相关产品.这里跟大家介绍一下rust与对象存储交到的基本套路和其中的一些技巧. 基本连接 我们以 aws 对象存储的sdk为例来说说基 ...

  4. SQLLabs靶场 less11-20

    SQLLabs靶场 less11-20 Less-11-16 请求方式 注入类型 拼接方式 POST 联合.报错.布尔盲注.延时盲注 username='x'11 请求方式 注入类型 拼接方式 POS ...

  5. mac 如何快捷键打开当前文件夹对应的终端窗口

  6. 2020-11-20:java中,听说过CMS的并发预处理和并发可中断预处理吗?

    福哥答案2020-11-20:[答案来自此链接:](http://bbs.xiangxueketang.cn/question/391)1.首先,CMS是一个关注停顿时间,以回收停顿时间最短为目标的垃 ...

  7. 2021-07-14:接雨水。给定 n 个非负整数表示每个宽度为 1 的柱子的高度图,计算按此排列的柱子,下雨之后能接多少雨水。

    2021-07-14:接雨水.给定 n 个非负整数表示每个宽度为 1 的柱子的高度图,计算按此排列的柱子,下雨之后能接多少雨水. 福大大 答案2021-07-14: 左右指针向中间移动.左指针是左边柱 ...

  8. 2021-07-04:股票问题1。给定一个数组 prices ,它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。你只能选择某一天 买入这只股票,并选择在未来的某一个不同的日子

    2021-07-04:股票问题1.给定一个数组 prices ,它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格.你只能选择某一天 买入这只股票,并选择在未来的某一个不同的日子 ...

  9. vue全家桶进阶之路41:Vue3 语法糖<script setup>

    <script setup> 是 Vue 3 中的一种语法糖,它可以使组件的脚本更加简洁.易读,并且减少了一些样板代码.使用 <script setup>,你可以将组件的 pr ...

  10. from . import XXX

    [Python]from . import XXX 一. 官方文档 sound/ __init__.py  formats/ __init__.py wavread.py wavwrite.py ai ...