Handsome 美化补充

发表于 分类于

由于在网上找到的 handsome 主题的首页文章圆角的 css 代码只选择了首页的大头图版式，小头图和图片版式均无圆角和鼠标停留上浮效果，在这里分享下我加了这两个版式之后的代码，将其粘贴到 handsome 主题开发者设置的自定义 css 中即可。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
/*首页文章列表悬停上浮*/
.blog-post .panel-small:not(article),
.blog-post .panel:not(article), .panel-picture {
    transition: all 0.3s;
}

.blog-post .panel-small:not(article):hover,
.blog-post .panel:not(article):hover, .panel-picture:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 10px rgba(73, 90, 47, 0.47);
}

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

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

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

.border-radius-6 {
border-radius: 15px;
}