css特效:鼠标经过变换按钮内容

热帖

css特效:鼠标经过变换按钮内容
css特效:鼠标经过变换按钮内容
style.css代码:

html代码:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Button</title>
    <link rel="stylesheet" href="style.css" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
    />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400;500;600;700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
      rel="stylesheet"
    />
  </head>
  <body>
    <div class="btn-wrapper">
      <button class="btn">
        <span class="btn-text1">Explore More</span>
        <span class="btn-text2">It's interesting!</span>
      </button>
    </div>
  </body>
</html>

 

 

如果你喜欢我们的文章,欢迎您分享或收藏路人粉的文章! 我们网站的目标是帮助每一个有求知欲的人,无论他们的水平和经验如何。我们相信,只要有热情和毅力,无论从什么时候开始学习都不晚。
© 版权声明
THE END
喜欢就支持一下吧
点赞10赞赏 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容