查看“模板:单行导航”的源代码

<includeonly><div class="map-dh"><div class="map-dh-left">{{#if:{{{标题|}}}|{{{标题|}}}|展示模式}}</div><div class="map-dh-right">{{#forargs:|k|v|{{#ifeq:{{#var:k}}|标题||[[{{#var:v}}|{{#tag:span|{{#var:k}}|class="map-dh-an"}}]]}}}}</div></div>{{#css:
#headBox{display:none}<!--标题默认隐藏-->
.map-dh {
    position: relative;
    background-color: rgba(255, 255, 255, 0.25);
    padding: 8px 5px 12px 0px;
    color: #5e5d6b;
    font-family: SourceHanSansCN-Medium, sans-serif;
    border-radius: 3px;
    margin: 0 0 20px 0;
    display: flex;
    align-items: center;
}
.map-dh:after {
    content: "";
    border: 1px solid #ffffffbf;
    width: 100%;
    height: 100%;
    position: absolute;
    top: -4;
    left: -4;
    border-radius: 3px;
    pointer-events: none;
}
.map-dh-left {
    border-right: 2px solid white;
    font-weight: bold;
    color: #464654;
    padding: 0 12px;
}
.map-dh-right {
    display: flex;
    flex-wrap: wrap;
    padding: 0px 5px 0 12px;
    gap: 10px;
}
.map-dh-an {
  min-width: 3em;
}
.map-dh-an:hover {
    cursor: pointer;
}
@media only screen and (max-width:759px){
  .map-dh {
      flex-direction: column;
      padding: 2px 10px 10px 5px;
  }
  .map-dh-left{
    border-right: unset;
    border-bottom: 2px solid white;
    width: 100%;
    text-align: center;
    padding: 0 0 4px;
}
  .map-dh-right{
      padding: 4px 0 0 0;
      gap: 4px 10px;
  }
}
}}</includeonly><noinclude>{{InfoBox|此模板魔改自原神模板:图鉴导航}}[[分类:模板]]<pre>{{单行导航|标题=测试标题|按钮=链接网页1|按钮名字2=链接网页2}}</pre>{{单行导航|标题=测试标题|按钮=链接网页1|按2=链接网页1|按3=链接网页1|按钮名字2=链接网页2}}</noinclude>