2
0
0

wordpress-给博客添加logo扫光效果

珂昂康
2024-3-16 2983

效果展示:

 

添加CSS:

如果你使用普通WordPress模板,需要打开WordPress博客后台,找到外观->自定义->额外CSS,将以下代码放置进去即可。

如果你使用子比主题的话,你可以把代码放到子比主题设置->全局和功能->自定义代码->自定义CSS样式里面。

[ttreply]

.navbar-brand {
  position: relative;
  overflow: hidden;
  margin: 0px 0 0 0px;
}

.navbar-brand:before {
  content: "";
  position: absolute;
  left: -665px;
  top: -460px;
  width: 200px;
  height: 15px;
  background-color: rgba(255, 255, 255, .5);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: searchLights 6s ease-in 0s infinite;
  -o-animation: searchLights 6s ease-in 0s infinite;
  animation: searchLights 6s ease-in 0s infinite;
}

@-moz-keyframes searchLights {
  50% {
    left: -100px;
    top: 0;
  }

  65% {
    left: 120px;
    top: 100px;
  }
}

@keyframes searchLights {
  40% {
    left: -100px;
    top: 0;
  }

  60% {
    left: 120px;
    top: 100px;
  }

  80% {
    left: -100px;
    top: 0px;
  }
}

[/ttreply]

最新回复 (2)
  • 等风来 2024-3-16
    0 2

    支持楼主

  • 0 3

请先登录后发表评论!

返回