CoreNext主题优化-页面美化集合

首页列表放大效果

.post-item {
  display: flex;
  padding: 20px;
  background-color: #fff;
  border-bottom: 1px solid #f5f6f700;
  transition: 0.3s;
  align-items: stretch;
  position: relative;
  border-radius: 20px;
  margin-right: 8px;
  margin-left: 8px;
  margin-top: 5px;
  padding: 6px;
  transition: All 0.3s ease-in-out;
  -webkit-transition: All 0.3s ease-in-out;
  -moz-transition: All 0.3s ease-in-out;
  -o-transition: All 0.3s ease-in-out;
}
.post-item:hover {
  background: #edededba;
  transform: scale(1.1);
  -webkit-transform: scale(1.01);
  -moz-transform: scale(1.01);
  -o-transform: scale(1.01);
  -ms-transform: scale(1.01);
  box-shadow:2px 2px 2px gray;
}

手机版底部备案信息居中展示

@media screen and (max-width: 800px) {
  .core-footer {
    text-align: center;
  }
  .core-footer .footer-main .icp-warp {
    display: block;
    text-align: center;
  }
  .core-footer .footer-main .icp-warp>div {
    display: block;
  }
}

文章页相关推荐 文字列表展示时竖向排列  使用图文时不推荐

.related-articles .related-articles-list {
  display: block;
}

底部左侧小工具

.core-footer .footer-main .footer-left {
    gap: 0px;
}

logo 扫光特效

.home-img {
	position:relative;
	float:left;
	margin-right:10px;
	padding:5px 0;
	overflow: hidden;
	}
.home-img  a:before{
	content:"";
	position: absolute;
	left: -300px;
	width: 250px;
	height: 10px;
	background-color: rgba(255,255,255,.5);
	-webkit-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	transform: rotate(-30deg);
	-webkit-animation: searchLights 2s ease-in 2s infinite;
	-o-animation: searchLights 2s ease-in 2s infinite;
	animation: searchLights 2s ease-in 2s infinite;}
	@-webkit-keyframes searchLights {
	0% { left: -100px; top: 0; }
	to { left: 120px; top: 100px; }
	}
	@-o-keyframes searchLights {
	0% { left: -100px; top: 0; }
	to { left: 120px; top: 100px; }
	}
	@-moz-keyframes searchLights {
	0% { left: -100px; top: 0; }
	to { left: 120px; top: 100px; }
	}
	@keyframes searchLights {
	0% { left: -100px; top: 0; }
	to { left: 120px; top: 100px; }
}

首页列表图片放大效果

.post-left img {
    transition: All 0.3s ease-in-out;
    -webkit-transition: All 0.3s ease-in-out;
    -moz-transition: All 0.3s ease-in-out;
    -o-transition: All 0.3s ease-in-out;
}
.post-left img:hover {
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    -ms-transform: scale(1.05);
    box-shadow:2px 2px 2px gray;   
}

菜单放大优化

.header-menu-warp>div>a:hover {
  transform: scale(1.15);
  -webkit-transform: scale(1.15);
  -moz-transform: scale(1.15);
  -o-transform: scale(1.15);
  -ms-transform: scale(1.15);
}
© 版权声明
THE END
喜欢就支持一下吧
点赞0打赏 分享
评论 共1条

请登录后发表评论

    • 头像小白0