VPS参考、测评、推荐
分享你关注的VPS主机优惠信息

草根吧VPS_WordPress技巧分享_博客“NEW”、“置顶”图标样式调整为按指定角度倾斜

草根吧VPS_WordPress技巧分享_博客“NEW”、“置顶”图标样式调整为按指定角度倾斜

原版的图标样式太丑了,在插件显示样式的时候将“NEW”、“置顶”的显示调整成了按角度倾斜的样式;

草根吧VPS_WordPress技巧分享_博客“NEW”、“置顶”图标样式调整为按指定角度倾斜

使用方式很简单,将以下复制到 main. 中即可

/** 修正摘要定位方式 */  .excerpt {      position: relative;  }  /** NEW 图标版样式 **/  .excerpt .new-icon{      position: absolute;      right: -45px;      top: -20px;      display: block;      width: 120px;      height: 24px;      line-height: 24px;      background: #4caf50;      color: #fff;      font-size: 16px;      font-weight: 500;      text-align: center;      transform: rotate(36deg);      transform-origin: 0% 0%;  }    /** 置顶图标版样式 **/  .sticky-icon {      position: absolute;      padding: 0;      right: -45px;      top: -20px;      display: block;      width: 120px;      height: 24px;      line-height: 24px;      background: #ff5e52;      color: #fff;      font-size: 16px;      font-weight: 500;      text-align: center;      transform: rotate(36deg);      transform-origin: 0% 0%;  }  @media (max-width:640px){      .excerpt-sticky header{text-indent:0px;position: unset;}      .sticky-icon {          position: absolute;          padding: 0;          right: -45px;          left: auto;          top: -20px;          display: block;          width: 120px;          height: 24px;          line-height: 24px;          background: #ff5e52;          color: #fff;          font-size: 16px;          font-weight: 500;          text-align: center;          transform: rotate(36deg);          transform-origin: 0% 0%;      }  }  

 

:草根吧VPS_WordPress技巧分享_博客“NEW”、“置顶”图标样式调整为按指定角度倾斜,://.caogenba../725.html

赞(0) 打赏
未经允许不得转载:草根吧VPS_最新VPS信息参考 » 草根吧VPS_WordPress技巧分享_博客“NEW”、“置顶”图标样式调整为按指定角度倾斜
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址