关于
教程来源至网络
自定义CSS
自定义
CSS
丨放入后台-外观设置-开发者设置-自定义CSS首页文章版式阴影化
首页文章版式阴影化
.panel{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
.panel:hover{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
.panel-small{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
.panel-small:hover{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
首页文章图片获取焦点放大
首页文章图片获取焦点放大
.item-thumb{
cursor: pointer;
transition: all 0.6s;
}
.item-thumb:hover{
transform: scale(1.05);
}
.item-thumb-small{
cursor: pointer;
transition: all 0.6s;
}
.item-thumb-small:hover{
transform: scale(1.05);
}
标签云整齐排列
标签云整齐排列
/*标签云*/
#tag_cloud-2 a {
border-radius: 5px;
width: 32%;
}
文章内打赏图标跳动
文章内打赏图标跳动
/*文章内打赏图标跳动*/
.btn-pay {
animation: star 0.5s ease-in-out infinite alternate;
}
@keyframes star {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
手机适配中不显示热门及标签云
手机适配中不显示热门及标签云
将以下代码添加至
后台-开发者设置-自定义CSS
。
/*手机不显示*/
@media (max-width:767px) {
#tabs-4,#tag_cloud-2 {
display: none;
}
}
文章标题居中
文章标题居中
/*文章标题居中*/
.panel h2{
text-align: center;
}
.panel-small h2{
text-align: center;
}
.panel-picture h3{
text-align: center;
}
.post-item-foot-icon{
text-align: center;
}
美化主页文章列表宽度
美化主页文章列表宽度
/* 非盒子模式页面宽度 */
.no-container #post-panel, .no-container .blog-posts {
max-width: 90%;
}
粗体上色
粗体上色
/* 粗体上色 */
strong{
color: rgb(255, 153, 0);
}
panel阴影
panel阴影
/*panel阴影*/
.panel{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
.panel:hover{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
.panel-small{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
.panel-small:hover{
box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255, 112, 173, 0.35);
}
.app.container {
box-shadow: 0 0 30px rgba(255, 112, 173, 0.35);
}
右侧栏气泡颜色加深
右侧栏气泡颜色加深
/* 右侧栏气泡颜色加深 */
div.post-tags>a,aside.asideBar .badge{background-color:#777}
时光机圆形头像
时光机圆形头像
/* 时光机圆形头像 */
.img-square {border-radius: 50%;}
.list-group-item .thumb-sm .img-square {border-radius: 5px;}
美化网站右侧滚动条样式
美化网站右侧滚动条样式
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
width: 8px;
height: 6px
}
/*定义滚动条轨道*/
::-webkit-scrollbar-track {
background-color: transparent;
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
background-color: #30B07F;
background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.4) 100%,transparent 100%,transparent 50%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.4) 75%,transparent 75%,transparent);
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em
}
104 条评论
大佬,请教一下,如何像你一样添加首页,快捷搜索,百度谷歌这些?
第三页有哦! 首页添加快捷搜索OωO
刚刚找到了,谢谢,nice
没事哦( ,,´・ω・)ノ"(´っω・`。)
大佬的这个服务器运行状态是咋弄的
这个是兔子插件哦,目前是未公布版本。
好吧谢谢大佬
没有啦,我才不是大佬哦。
我只是个连代码都不会的小白。
右边栏二维码会影响文章目录的生成,不知道怎么解决的?再刷新一遍当前页面又可以正常刷出来。
已解决,多jquery版本不同导致冲突
嗯呢,解决了就好,对于pjax我也是无力。我这的pjax还是有些问题。
请教一下,超链接特效这个按照教程修改似乎没有效果。
你可以先尝试下,看看是不是什么插件及代码冲突。或者是有缓存没进行清除!
加我QQ明天有空远程给你看看吧!QQ:1287470612
已经解决了,文章超链接是由于css被覆盖了,提到最前就好了。另外发现你的这个css只能匹配文章内的超链接,设置的版权信息的超链接没有覆盖到,给版权div设置了class,新加了一份css后搞定。
嗯可以了就好,一般最好是不要覆盖在版权那,因为会使版权那信息加宽,不是很好看!
嗯嗯,确实会,所以连版权的样式我也重新调整了下
恩
分页代码更新了,之前那个太丑: https://yinhe.co/archives/20201117_handsome_pagenav.html
哈哈已更新!
不错呀!
不过提个小建议,左侧栏人名MuYu那个地方使用标签,这样可以正常显示黑色了,不然依然使用标签的话,那个颜色在那里其实挺奇怪的
以及,微风博客已经挂了,所以你需要自己搭建api接口了(我不知道为啥我有跨域问题,以前没有 )
感谢支持~
左侧栏名称,我是加了加粗改色css,所以会变色。
谢谢提醒啦~等有时间碰电脑在做调整下吧。
至于你所说的微风博客的API那是什么的API。
修改了太多咯,已经记不清楚哪里是哪里咯
好吧,标签被那啥了,那个恢复正常颜色的是b标签
爱了爱了 写得好好哟,我要给你生猴子!(ฅ´ω`ฅ)
感谢支持哦
你好,首页全站友链显示图片给的代码不全,望修正下,谢谢
已更新,请刷新页面查看!OωO
多谢反馈,立马就去更新
已经可用,博主主题优化总结的很好,幸苦了
感谢支持,其实还有好多都没时间(懒)写上来。
啊这 怎么复制不了啊
等等我还是去关了禁止复制的吧。(/ω\)
o(*////▽////*)q
点击代码框右上角便可以复制拉。
AliceStyle插件/bug多╮(╯▽╰)╭
哈哈,可以的话最好就是自己修改啦。
插件有插件的好,就是方便,但是一有BUG啥的不好改动!