html–CSS悬停在锚标签上,显示i-beam光标几分之一秒

概述我正在通过重新创建ionicframework.com网站来学习ReactJS.但是有一个小问题.我在标题上有一组锚标记.当我将鼠标悬停在它们上面时,光标会变为工字形,持续几分之一秒,然后它会变为指针(这是预期的).在我的机器上的firefox和chrome中都可以看到这一点. website显然没有这个小故障.我试着抓住我的屏幕来说明发生了什么. Here

我正在通过重新创建ionicframework.com网站来学习ReactJs.但是有一个小问题.

我在标题上有一组锚标记.当我将鼠标悬停在它们上面时,光标会变为工字形,持续几分之一秒,然后它会变为指针(这是预期的).在我的机器上的firefox和Chrome中都可以看到这一点. website显然没有这个小故障.我试着抓住我的屏幕来说明发生了什么. Here’s GIF托管于imgur.

我没有附加反应链接的听众.它是纯CSS,带有：hover伪类.

我也做了一个fiddle,但遗憾的是故障很小(尝试快速移动鼠标并经常通过链接查看)

.preheader {    position: relative;    background: white;    Box-shadow: 0 1px 2px 0 rgba(0,20,56,.06);    padding: 8px 0;    top: 0;    left: 0;    z-index: 999;}.container {    padding-left: 15px;    padding-right: 15px;    margin-left: auto;    margin-right: auto;    wIDth: 100%;}.preheaderMenu {    Font-family: 'Eina',"Helvetica Neue",Helvetica,sans-serif;    Font-weight: 600;    display: flex;    justify-content: space-between;    align-items: baseline;    z-index: inherit;}.preheaderlinks {    z-index: inherit;    Box-sizing: border-Box;    Transition: .2s color;    padding-right: 16px;    Font-size: 10px;    color: #a8b0be;    letter-spacing: .04em;}.preheaderlinks:hover {    color: #3880ff;    cursor: pointer;}.subMenu {    z-index: inherit;    Box-sizing: border-Box;    display: flex;    flex-direction: row;    justify-content: flex-start;    align-items: baseline;}.preheaderlinksUnderlined {    letter-spacing: .06em;    color: #727a87;    text-transform: uppercase;    padding: 0;    border-bottom: 2px solID #e8ebf1;}.preheaderCTA {    text-decoration: none;    Transition: 0.3s background,0.2s color;    color: #3880ff;    background-color: #e3efff;    Box-sizing: border-Box;    Font-size: 10px;    letter-spacing: 0.04em;    border-radius: 3px;    padding: 4px 6px;    margin-right: 30px;}.preheaderCTA:hover {    color: #fff;    background-color: #3880ff;    Box-shadow: none;}