当鼠标滑到文章区块时,按钮高光就像拉帘一样拉开,就像我们网站上的LOGO特效显示一样,这里面的代码需要修改原主题内的按钮属性和值。效果图如下:

注:在WordPress真的themes的文件夹当中,找到begin主题的style.css文件,然后搜索对应的类。
比如: .entry-more a
在操作之前请自行备份主题要修改的文件。
.entry-more a {
position: absolute;
right: -1px;
bottom: 18px;
z-index: 1;
float: left;
overflow: hidden;
margin-right: 2.5em;
padding: 0 9pt;
width: auto;
background: #56c5ff;
color: #fff!important;
text-align: center;
font-weight: 400;
line-height: 30px;
cursor: pointer
}
.entry-more a:after {
position: absolute;
top: 0;
left: 0;
z-index: -1;
width: 500%;
height: 1000%;
background: #3690cf;
content: "";
transition: transform .3s;
transform: translateX(calc(20% - 25px)) translateY(10%) rotate(-45deg);
transform-origin: 0 0
}
2、注意原主题中.entry-more a:hover需要全部删除,最后将下面代码加在样式表内:
//载自叶忠文博客https://www.japanren.com/2010.html
.post:hover .entry-more a:after {
transform: translateY(10%) translateX(-25px) rotate(-45deg)
}