子比主题 – 文本超链接美化样式

图片[1]-子比主题 – 文本超链接美化样式-极客源码

代码部署

子比主题–>>自定义CSS样式即可!

@font-face {
    font-family: 'tengfei-font';
    src: url('//at.alicdn.com/t/c/font_4823557_nwo4uyriby.woff2?t=1741491889382') format('woff2'),
      url('//at.alicdn.com/t/c/font_4823557_nwo4uyriby.woff?t=1741491889382') format('woff'),
      url('//at.alicdn.com/t/c/font_4823557_nwo4uyriby.ttf?t=1741491889382') format('truetype');
   }
   
    .wp-posts-content a:not([class]),.wp-block-list a:not([class]) {
      color: var(--focus-color);
      line-height: 1.15em;
      padding: .1em .35em;
      font-size: max(.75rem,.75em);
      border-radius: 2em;
      background: var(--focus-color-opacity1) linear-gradient(var(--focus-shadow-color) 0 0) no-repeat 100% 100%/0 100% border-box;
      -webkit-box-decoration-break: clone;
      box-decoration-break: clone;
      transition: .7s cubic-bezier(.6,.1,0,1),background-position 0s;
      word-break: break-all;
      display: inline-flex;
      align-items: center;
      transform: translateY(-1.15px)
    }
    .wp-posts-content a:not([class]):hover,.wp-block-list a:not([class]):hover {
      color: #fff;
      background-position-x: 0;
      background-size: 100% 100%
    }
    .wp-posts-content a:not([class]):before,.wp-block-list a:not([class]):before {
     content: "\ec7f";
     font-family: 'tengfei-font';
      height: 1.15em;
      display: -webkit-inline-flex;
      display: inline-flex;
      -webkit-align-items: center;
      align-items: center;
      -webkit-justify-content: center;
      justify-content: center;
      aspect-ratio: 1;
      margin: 0 0 0 -.3em;
      background: var(--focus-shadow-color);
      border-radius: 50%;
      color: #fff;
      transition: inherit
    }
    .wp-posts-content a:not([class]):hover:before,.wp-block-list a:not([class]):hover:before {
      background: #fff;
      color: var(--focus-color);
      rotate: 45deg;
      scale: .9
    }
© 版权声明
THE END
喜欢就支持一下吧
点赞11 分享
评论 共1条

请登录后发表评论

    请登录后查看评论内容