意见箱
恒创运营部门将仔细参阅您的意见和建议,必要时将通过预留邮箱与您保持联络。感谢您的支持!
意见/建议
提交建议

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

来源:恒创科技 编辑:恒创科技编辑部
2024-01-11 12:40:59
关于“用CSS怎样处理链接悬停跳动的问题,方法有什么”的知识有一些人不是很理解,对此小编给大家总结了相关内容,具有一定的参考借鉴价值,而且易于学习与理解,希望能对大家有所帮助,有这个方面学习需要的朋友就继续往下看吧。

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

实现方式1:

a:hover{font-weight:blod}

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


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

实现方式2:

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

效果对比:


以上就是关于“用CSS怎样处理链接悬停跳动的问题,方法有什么”的相关知识,感谢各位的阅读,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注群英网络,小编每天都会为大家更新不同的知识。
上一篇: [CSS入门到进阶] 4行CSS实现footer置底!超常见的需求,快来收藏 下一篇: 手机怎么远程登录云服务器?