Template:WelcomeHeader/styles.css
模板页面
更多操作
.main-banner {
display: flex;
align-items: center;
gap: 32px;
padding: 32px 40px;
background: var(--color-surface-1);
border-radius: 2px;
border-left: 5px solid #3e83ff;
border-top: 1px solid rgba(0,0,0,0.08);
border-right: 1px solid rgba(0,0,0,0.08);
border-bottom: 1px solid rgba(0,0,0,0.08);
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
overflow: hidden;
}
.banner-left img {
max-width: 180px;
height: auto;
filter: grayscale(100%);
}
.banner-right {
flex: 1;
text-align: left;
}
.title {
color: rgba(15, 23, 42, 50);
font-family: "Georgia", "Times New Roman", serif;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.3;
background-image: url('https://wiki.ottohub.cn/images/d/d9/Title_text_cover.png');
}
.subtitle {
font-size: 18px;
margin: 0.5em 0 1.5em;
color: #475569;
font-weight: 400;
line-height: 1.6;
}
.divider {
height: 1px;
background: rgba(0,0,0,0.1);
margin-bottom: 1.2em;
width: 100%;
}
.count {
font-size: 14px;
margin: 0;
letter-spacing: 0.1em;
color: #64748b;
font-weight: 600;
}
.count span {
color: #3e83ff;
font-family: sans-serif;
font-weight: 700;
}
/* ≤600 px 时纵向布局 */
@media(max-width: 600px){
.main-banner {
flex-direction: column;
text-align: left;
border-left: 1px solid rgba(0,0,0,0.08);
border-top: 4px solid #3e83ff;
}
.banner-right {
text-align: left;
}
.divider {
width: 100%;
margin: 16px 0;
}
}