查看“模板:阅读版块选项”的源代码

<includeonly><div class="readBtnGroup">
{{#switch:{{{1|}}}{{#vardefine:readBtnH|110x164px}}
|#default=
<div class="sxh">[[file:思念长图-两心同.png|{{#var:readBtnH}}|link=沈星回:{{{1|}}}]]<div class="readBtn-name">沈星回</div></div>
<div class="ls">[[file:思念长图-声声惜.png|{{#var:readBtnH}}|link=黎深:{{{1|}}}]]<div class="readBtn-name">黎深</div></div>
<div class="qy">[[file:思念长图-一剪春.png|{{#var:readBtnH}}|link=祁煜:{{{1|}}}]]<div class="readBtn-name">祁煜</div></div>
<div class="qc">[[file:思念长图-人间事.png|{{#var:readBtnH}}|link=秦彻:{{{1|}}}]]<div class="readBtn-name">秦彻</div></div>
<div class="xyz">[[file:思念长图-绕金枝.png|{{#var:readBtnH}}|link=夏以昼:{{{1|}}}]]<div class="readBtn-name">夏以昼</div></div>
|公众号=<div class="gzh">[[file:公众号头像-深空时代.png|{{#var:readBtnH}}|link=玩家/公众号]]<div class="readBtn-name">公众号</div></div>
|朋友圈=<div class="sxh">[[file:思念长图-两心同.png|{{#var:readBtnH}}|link=沈星回:{{{1|}}}]]<div class="readBtn-name">沈星回</div></div>
<div class="ls">[[file:思念长图-声声惜.png|{{#var:readBtnH}}|link=黎深:{{{1|}}}]]<div class="readBtn-name">黎深</div></div>
<div class="qy">[[file:思念长图-一剪春.png|{{#var:readBtnH}}|link=祁煜:{{{1|}}}]]<div class="readBtn-name">祁煜</div></div>
<div class="qc">[[file:思念长图-人间事.png|{{#var:readBtnH}}|link=秦彻:{{{1|}}}]]<div class="readBtn-name">秦彻</div></div>
<div class="xyz">[[file:思念长图-绕金枝.png|{{#var:readBtnH}}|link=夏以昼:{{{1|}}}]]<div class="readBtn-name">夏以昼</div></div>
<div class="wj">[[file:对话头像-玩家-0.png|{{#var:readBtnH}}|link=玩家/{{{1|}}}]]<div class="readBtn-name">玩家</div></div>
}}</div>{{#if:{{#var:阅读版块选项css防重复加载}}||{{#vardefine:阅读版块选项css防重复加载|1}}
{{#css:
.readBtnGroup{
display:flex;
gap:10px;
justify-content: flex-start;
height:180px;
width:100%;
}
.readBtnGroup>div{width: calc(100% - 50px);max-width:110px;}
.readBtnGroup>div>*{text-align:center;color:white;text-shadow: 3px 3px 3px grey;}
.readBtn-Name{display:none;}
.readBtnGroup>div:hover .readBtn-Name{display:block;}
.readBtnGroup img{opacity:0.7;border:1px solid white;}
.readBtnGroup>div:nth-child(1) img{border-radius:0px 20px 20px 20px;}
.readBtnGroup>div:nth-child(2) img{border-radius:20px 20px 20px 0px;}
.readBtnGroup>div:nth-child(3) img{border-radius:20px 0px 20px 20px;}
.readBtnGroup>div:nth-child(4) img{border-radius:20px 20px 0px 20px;}
.readBtnGroup>div:nth-child(5) img{border-radius:0px 20px 20px 20px;}
.readBtnGroup>div:nth-child(6) img{border-radius:20px 20px 20px 0px;}
.readBtnGroup img:hover{opacity:1;}
/* 手机端适配 */
@media screen and (max-width: 430px) {
    .readBtnGroup>div:nth-child(1) img{border-radius:0px 16px 16px 16px;}
    .readBtnGroup>div:nth-child(2) img{border-radius:16px 16px 16px 0px;}
    .readBtnGroup>div:nth-child(3) img{border-radius:16px 0px 16px 16px;}
    .readBtnGroup>div:nth-child(4) img{border-radius:16px 16px 0px 16px;}
    .readBtnGroup>div:nth-child(5) img{border-radius:0px 16px 16px 16px;}
    .readBtnGroup>div:nth-child(6) img{border-radius:16px 16px 16px 0px;}
    .readBtnGroup>div{max-width:59px;}
    .readBtn-Name{display:block;}
    .readBtnGroup{height:120px;gap:5px;}
    .readBtnGroup>div>* {text-shadow: 1px 1px 1px grey;font-weight:normal;}
}
/* iPad适配 (包含iPad mini) */
@media screen and (min-width: 431px) and (max-width: 1024px) {
}
}}}}</includeonly><noinclude>{{Tabs|cssClass=lineTabs
|短信={{阅读版块选项|短信}}
|朋友圈={{阅读版块选项|朋友圈}}
|语音视频={{阅读版块选项|语音视频}}
|公众号={{阅读版块选项|公众号}}
}}
{{Tabs|cssClass=lineTabs
|短信={{阅读版块选项|短信}}
|朋友圈={{阅读版块选项|朋友圈}}
|语音视频={{阅读版块选项|语音视频}}
|公众号={{阅读版块选项|公众号}}
}}
{{Tabs|cssClass=lineTabs
|短信={{阅读版块选项|短信}}
|朋友圈={{阅读版块选项|朋友圈}}
|语音视频={{阅读版块选项|语音视频}}
|公众号={{阅读版块选项|公众号}}
}}
</noinclude>