学堂 学堂 学堂公众号手机端

用CSS怎样处理链接悬停跳动的问题,方法有什么

lewis 1年前 (2024-04-01) 阅读数 5 #技术
关于“用CSS怎样处理链接悬停跳动的问题,方法有什么”的知识有一些人不是很理解,对此小编给大家总结了相关内容,具有一定的参考借鉴价值,而且易于学习与理解,希望能对大家有所帮助,有这个方面学习需要的朋友就继续往下看吧。

需求:实现鼠标悬停在链接上时,链接字体加粗的功能。

实现方式1:

a:hover{font-weight:blod}

结果鼠标悬停的时候,页面会有跳动的现象。因为改变字体的时候改变了元素的大小,所以引起了页面的重排,所以会有跳动的现象。


实现方式2:

a:hover{text-shadow: 1px 0 0 currentColor;}

效果对比:


以上就是关于“用CSS怎样处理链接悬停跳动的问题,方法有什么”的相关知识,感谢各位的阅读,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注群英网络,小编每天都会为大家更新不同的知识。
版权声明

本文仅代表作者观点,不代表博信信息网立场。

热门