查看“模板:测试模板请忽略”的源代码

<includeonly>
<div class="row">
  <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
    {{服饰|布局=col-sm-4}}
  </div>
  <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
<div class="resp-tabs" style="border-spacing: 0px;">
<ul class="resp-tabs-list clearfix" style="margin-left:0;margin-top:0px">
<li class="active bili-list-style"><span class="tab-panel" style="font-size:14px" >{{{角色A}}}</span></li>
<li class="bili-list-style" ><span class="tab-panel" style="font-size:14px" >{{{角色B}}}</span></li>
<li class="bili-list-style" ><span class="tab-panel" style="font-size:14px" >{{{角色C}}}</span></li>
<li class="bili-list-style" ><span class="tab-panel" style="font-size:14px" >{{{角色D}}}</span></li>
<li class="bili-list-style" ><span class="tab-panel" style="font-size:14px" >{{{角色E}}}</span></li>
</ul>
<div class="resp-tabs-container">
<div class="resp-tab-content" style="display:block;">
{{{超级轮播|w=70%|h=80%|宽高比=20/40
|
[[文件:潮汐晨涌.png|缩略图|替代=潮汐晨涌.png]]
|
[[文件:潮汐晨涌战损.png|缩略图|替代=潮汐晨涌战图.png]]
|角色A-3
}}}
</div>
<div class="resp-tab-content">
    {{{超级轮播|w=70%|h=80%|宽高比=20/40
|角色B-1
|角色B-2
|角色B-3
}}}
</div>
<div class="resp-tab-content">
    {{{超级轮播|w=70%|h=80%|宽高比=20/40
|角色C-1
|角色C-2
|角色C-3
}}}
</div>
<div class="resp-tab-content">
    {{{超级轮播|w=70%|h=80%|宽高比=20/40
|角色D-1
|角色D-2
|角色D-3
}}}
</div>
<div class="resp-tab-content">
    {{{超级轮播|w=70%|h=80%|宽高比=20/40
|角色E-1
|角色E-2
|角色E-3
}}}
</div>
</div>
</div>
<p>{{{角色对白}}}</p>
<noinclude>
{{服饰|布局=col-sm-4}}
{{测试模板请忽略
|角色A=祁煜
|角色B=沈星回
|角色C=黎深
|角色D=秦彻
|角色E=夏以昼
|角色对白=角色对白角色对白角色对白角色对白角色对白角色对白
}}
</noinclude>
{{#css:
.tab-panel {
    display: block;
    height: auto;
    padding: 5px 5px;
    text-decoration: none;
    width: 76px;
    text-align: center;
    color: #333;
}

.resp-tabs-list li {
    float: left;
    background: #ddd;
    border-radius: 3px;
    margin: 2px;
}

.resp-tabs-list li.active .tab-panel, .tab-panel:hover {
    font-family: MicrosoftYaHei-Bold;
    font-size: 14px;
    color: #fff;
    text-align: center;
    font-weight: bold;
    background: rgba(102, 102, 102, 0.7);
    border-radius: 3px;
}

@media only screen and (max-width:759px){
    ul.tabbernav li a {
        display: inline-block;
    }
    ul.tabbernav {
        padding: 0px;
    }
    .resp-tabs .resp-tabs-list {
        white-space: normal;
        overflow-x: auto;
    }
}}