前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Handsome底部页脚标签样式

Handsome底部页脚标签样式

作者头像
kenvie
发布2022-01-20 14:49:10
8000
发布2022-01-20 14:49:10
举报
文章被收录于专栏:kenviekenvie

添加自定义css

Handsome主题可以直接去后台 自定义 CSS处添加以下代码

代码语言:javascript
复制
.github-badge {
    display: inline-block;
    border-radius: 2px;

    text-shadow: none;
    font-size: 10px;
    color: #fff;
    line-height: 13px;

    background-color: #ABBAC3;

    margin-bottom: 3px;
}

.github-badge .badge-subject {
    display: inline-block;
    background-color: #4D4D4D;
    padding: 2px 2px 2px 3px;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}

.github-badge .badge-value {
    display: inline-block;
    padding: 2px 3px 2px 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}

.github-badge .bg-brightgreen {
    background-color: #4c1 !important;
}
.github-badge .bg-green {
    background-color: #97CA00 !important;
}
.github-badge .bg-yellow {
    background-color: #dfb317 !important;
}
.github-badge .bg-zise {
    background-color:#F08080 !important;
}
.github-badge .bg-orange {
    background-color: #fe7d37 !important;
}
.github-badge .bg-red {
    background-color: #e05d44 !important;
}
.github-badge .bg-blue {
    background-color: #007ec6 !important;
}
.github-badge .bg-grey, .github-badge .bg-gray {
    background-color: #555 !important;
}
.github-badge .bg-lightgrey, .github-badge .bg-lightgray {
    background-color: #9f9f9f !important;
}

选择显示位置

我觉得全都在左边好看一点

打开 Handsome主题设置,在 博客底部左侧信息添加以下代码

代码语言:javascript
复制
<a class="github-badge">
     <span class="badge-subject">Copyright</span>
     <span class="badge-value bg-brightgreen">LingN</span>
</a>
|
<a class="github-badge" target="_blank" href="http://www.beian.miit.gov.cn">
     <span class="badge-subject">鲁 ICP备</span>
     <span class="badge-value bg-red">20030371号</span>
</a>
|
<a class="github-badge" target="_blank" href="https://www.ihewro.com/">
     <span class="badge-subject">Themes</span>
     <span class="badge-value bg-blue">Handsome</span>
</a>
|
<a class="github-badge" target="_blank" href="https://typecho.org">
     <span class="badge-subject">Powered</span>
     <span class="badge-value bg-orange">Typecho</span>
</a>
|
<a class="github-badge" target="_blank" href="https://typecho.org">
     <span class="badge-subject">CDN服务</span>
     <span class="badge-value bg-zise"><img src="https://imgcache.qq.com/open_proj/proj_qcloud_v2/gateway/portal/css/img/nav/logo-bg-color.svg" style="width: 50px;"></span>
</a>

删除多余代码

usr/themes/handsome/component/footer.php中删掉以下代码

代码语言:javascript
复制
Powered by <a target="_blank" href="http://www.typecho.org">Typecho</a> | Theme by <a target="_blank"
                                                                                                     href="https://www.ihewro.com/archives/489/">handsome</a>
代码语言:javascript
复制
© <?php echo date("Y");?> Copyright 

版权属于:kenvie

本文链接:https://kenvie.com/22

商业转载请联系作者获得授权,非商业转载请注明出处。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020 年 08 月,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 添加自定义css
  • 选择显示位置
  • 删除多余代码
相关产品与服务
内容分发网络 CDN
内容分发网络(Content Delivery Network,CDN)通过将站点内容发布至遍布全球的海量加速节点,使其用户可就近获取所需内容,避免因网络拥堵、跨运营商、跨地域、跨境等因素带来的网络不稳定、访问延迟高等问题,有效提升下载速度、降低响应时间,提供流畅的用户体验。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档