修改方法:在主题后台-开发者设置-自定义CSS中添加

文章来源:Rat's Blog
列举部分修改,需查看更多修改请移步原作者博客

首页文章版式圆角化

本项修改的是首页文章版式,包括图片使其四个角由方形变成圆角形状。
圆角大小可修改15px数值

/*首页文章版式圆角化*/
.panel{
    border: none;
    border-radius: 15px;
}

.panel-small{
    border: none;
    border-radius: 15px;
}

.item-thumb{
    border-radius: 15px;  
}

首页文章图片获取焦点放大

本项修改的是首页文章图片,将鼠标放到首页头图后使其放大。
放大的时间和大小自行修改以下数值

/*首页文章图片获取焦点放大*/
.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);
}

首页文章版式阴影化

本项修改的是首页文章版式,包括图片使其四周加上一层绚丽的阴影。
阴影颜色修改rgba后面的值,最后的0.35为透明度

/*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);
}

文章最后修改时间格式

文件位置:/usr/theme/handsome/libs/content.php
修改public static function exportPostFooter中对应的内容
或者查找"最后修改"

文章博客信息及标签云颜色

文件位置:/usr/theme/handsome/component/sidebar.php
博客信息:修改<?php Typecho_Widget::widget('Widget_Stat')->to($stat); ?>中的<span class="badge xxxx">
标签云:修改<a href="<?php $tags->permalink();?>后面的class="label xxxx"
本站为bg-info

评论显示操作系统及浏览器

文章来源:崽崽's Blog

简介、下载、使用说明等见 Github 页面

下载插件,放入/usr/plugins目录
编辑usr/themes/handsome/component/comments.php,在第69行左右</span>后面插入:

<?php UserAgent_Plugin::render($comments->agent); ?>

Typecho后台启用UserAgent插件,设置显示信息

最后修改:2019 年 12 月 06 日 21 : 58