仪表板阅读器今朝免费素材下载 css3喜爱点赞按钮殊效

基于css3文章列表喜爱点赞按钮殊效源码是一款简略的js css3制造文章列表点击按钮喜爱或珍藏性能。爱心点赞按钮数目累计殊效。

1. 引入CSS

<link rel="stylesheet" href="css/style.css">

2. 引入JS

<script src="js/script.js"></script>

3. HTML代码

<article>
   <div class="like">
      <div class="icon">
         <svg viewBox="0 0 24 24">
            <path
                  d="M2.9219 12.4463C1.8489 9.0963 3.1039 4.9313 6.6209 3.7993C8.4709 3.2023 10.7539 3.7003 12.0509 5.4893C13.2739 3.6343 15.6229 3.2063 17.4709 3.7993C20.9869 4.9313 22.2489 9.0963 21.1769 12.4463C19.5069 17.7563 13.6799 20.5223 12.0509 20.5223C10.4229 20.5223 4.6479 17.8183 2.9219 12.4463Z"
                  />
         </svg>
      </div>
      <div class="shadow"></div>
      <div class="number">232</div>
   </div>
   <div class="content">
      <h1>领取形式</h1>
      <span>⏱ 进行中</span>
      <p>
        咱们想引入自界说域来启用红色标签效劳。今朝障碍咱们行进的是咱们今朝正在每一个公共仪表板上都提供HTTPS。定制您的URL将使其成为HTTP页面。
      </p>
      <p>
        咱们今朝在思考一种简略的办法来完成这个HTTPS。
      </p>
   </div>
</article>
<article>
   <div class="like active">
      <div class="icon">
         <svg viewBox="0 0 24 24">
            <path
                  d="M2.9219 12.4463C1.8489 9.0963 3.1039 4.9313 6.6209 3.7993C8.4709 3.2023 10.7539 3.7003 12.0509 5.4893C13.2739 3.6343 15.6229 3.2063 17.4709 3.7993C20.9869 4.9313 22.2489 9.0963 21.1769 12.4463C19.5069 17.7563 13.6799 20.5223 12.0509 20.5223C10.4229 20.5223 4.6479 17.8183 2.9219 12.4463Z"
                  />
         </svg>
      </div>
      <div class="shadow"></div>
      <div class="number">420</div>
   </div>
   <div class="content">
      <h1>言语转换</h1>
      <span>✨ New </span>
      <p>
         今朝咱们主动检测阅读器言语，并以此形式设置公共仪表板的言语。这多是由于用户有一个英文阅读器，但实际上更喜爱浏览德语的内容。
      </p>
   </div>
</article>

倡议实用阅读器：360、FireFox、Chrome、Opera、傲游、搜狗、世界之窗. 没有支持Safari、IE8及如下阅读器。