css-解決font-weight:blod跳動問題

需求：實現(xiàn)鼠標懸停在鏈接上時，鏈接字體加粗的功能。

實現(xiàn)方式1：

a:hover{font-weight:blod}

結(jié)果鼠標懸停的時候，頁面會有跳動的現(xiàn)象。因為改變字體的時候改變了元素的大小，所以引起了頁面的重排，所以會有跳動的現(xiàn)象。

實現(xiàn)方式2：

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

效果對比：


最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案？ 參考答案 (1)瀏覽器兼容問題一：不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,801評論 1贊 92
  • Bootstrap是什么？ 一套易用、優(yōu)雅、靈活、可擴展的前端工具集--BootStrap。GitHub上介紹 的...
    凜0_0閱讀 10,925評論 3贊 184
  • 轉(zhuǎn)載請聲明 原文鏈接地址 關注公眾號獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    前端進階之旅閱讀 16,621評論 32贊 459
  • 發(fā)現(xiàn) 關注 消息 iOS 第三方庫、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,241評論 4贊 61
  • 1.CSS基本概念 1.1 CSS的定義 CSS(Cascading Style Sheets)層疊樣式表，主要用...
    寥寥十一閱讀 1,875評論 0贊 6