模板

战斗员图鉴/个/小:修订间差异

来自卡厄思梦境WIKI

律Rhyme留言 | 贡献
创建页面,内容为“<div class="avatar-frame">[[File:face_character_{{{1|}}}.png|link=]]<div class="avatar-name">{{{2|}}}</div></div> 头像框容器样式:​ .avatar-frame { position: relative; display: inline-block; border: 3px solid #ccc; 灰色边框:​ border-radius: 5px; 轻微圆角:​ overflow: hidden; 确保内容不超出边框:​ box-shadow: 0 2px 5px rgba(0,0,0,0.1); 轻微阴影增加层次感:​ background: #f5f5f5; /* 浅…”
 
律Rhyme留言 | 贡献
无编辑摘要
 
(未显示同一用户的13个中间版本)
第1行: 第1行:
<div class="avatar-frame">[[File:face_character_{{{1|}}}.png|link=]]<div class="avatar-name">{{{2|}}}</div></div>
<div style="display:inline-block"><div class="avatar-frame" style="margin: 2px;">[[File:face_character_{{{1|}}}.png|link=]]<div class="avatar-name">{{{2|}}}</div></div></div>
/* 头像框容器样式 */
.avatar-frame {
    position: relative;
    display: inline-block;
    border: 3px solid #ccc; /* 灰色边框 */
    border-radius: 5px; /* 轻微圆角 */
    overflow: hidden; /* 确保内容不超出边框 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* 轻微阴影增加层次感 */
    background: #f5f5f5; /* 浅灰色背景作为图片加载前的占位 */
}
 
/* 头像图片样式 */
.avatar-frame img {
    display: block;
    width: 100px;
    height: 100px;
    object-fit: cover; /* 确保图片比例正确 */
}
 
/* 名称标签样式 */
.avatar-name {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 2px 8px;
    color: white;
    font-size: 12px;
    font-weight: bold;
    text-shadow: 0 0 2px black, 0 0 2px black; /* 白色描边效果 */
    white-space: nowrap; /* 防止文字换行 */
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis; /* 文字过长显示省略号 */
    border-top-right-radius: 3px; /* 右上角圆角 */
}

2025年10月20日 (一) 22:16的最新版本