Javascript 我能把工具提示放在移动屏幕的中间吗？

有没有一种方法可以使用CSS将工具提示的位置设置为屏幕中心，而不是相对于文本？我正在努力使工具提示在手机上工作得更好

@media only screen and (max-width: 500px){
.tip:hover span {
    position: absolute; 
    width: 19em;    
  }
}

---

使用

：hover

对移动设备来说不是个好主意。我已经更新了您的CSS，但是您的工具提示可能会从用户的视口中删除

@仅媒体屏幕和（最大宽度：500px）{
/*如前所述，我不知道为什么要使用：hover for mobile*/
.提示：悬停跨度{
显示：内联块；
位置：绝对位置；
顶部：计算值（100vh/2）；
左：计算值（100vw/2）；
转化：translateX（-50%）；
}
}

工具提示内容

这可能有效吗？您没有提供太多的原始代码

@仅媒体屏幕和（最大宽度：500px）{
.提示：悬停跨度{
位置：绝对位置；
左：50%；
最高：50%；
-webkit转换：翻译（-50%，-50%）；
转换：翻译（-50%，-50%）；
宽度：19em；
}
}

工具提示内容

在此处创建小提琴或添加一些html代码？CSS

：在移动设备上悬停

？？听起来不是个好主意，我相信如果使用

left:50%

和

top:50%

并且父元素具有

position:relative

。它将不是视口的中心。可能不是。这可能是一个开始，但如果Michelle提供了一个完整的工作示例就好了。