css 自定义悬浮窗写法


HTML:

  <span class="info" data-title="详情"></span>

css(sass):

 .info {
        }
        &:hover::after {
          content: attr(data-title);
          display: inline-block;
          width: 70px;
          height: 22px;
          border: 1px solid #0088d8;
          font-size: 14px;
          font-family: FZLanTingHeiS-R-GB;
          font-weight: 400;
          color: #00d2ff;
          margin-top: 30px;
          line-height: 22px;
          text-align: center;
          margin-left: -20px;
        }
      }

要注意data-title这个是和after伪类中的content的attr属性的名字对应上的


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM