|
|
| 第1行： |
第1行： |
| <includeonly> | | <includeonly> |
| <div class="item-container"> | | <!-- <h2> {{#var:驱动名称国服}} {{#var:驱动名称日服}} 音擎 </h2> --> |
| <div class="item-header">
| | <tabber> |
| <div class="item-image">
| | 高稀有度= |
| {{驱动图鉴/立绘}}
| | <center> |
| </div>
| | <div class="weapon-item-container"> |
| <div class="item-info">
| | [[File:深海访客1.png|center|class=weapon-item-image|alt=深海访客图片1]] |
| <div class="item-title">{{#var:驱动名称国服}}</div>
| | <div class="weapon-item-highlight"></div> |
| <div class="item-rarity">{{图标居左30px|{{#var:稀有度}}|隐藏名字=是}}</div>
| |
| <div class="item-description">{{#var:一句话介绍}}</div>
| |
| </div>
| |
| </div>
| |
| <div class="item- details"> | |
| <table>
| |
| <tr><th>名称</th><td>{{#var:驱动名称国服}}</td></tr>
| |
| <tr><th>属性</th><td>{{图标居左30px|{{#var:属性}}}}</td></tr>
| |
| <tr><th>高级属性</th><td>{{#var:高级属性}}</td></tr>
| |
| <tr><th>音擎效果</th><td>{{#var:音擎效果}}</td></tr>
| |
| <tr><th>{{#var:技能名}}</th><td>{{#var:技能名文本}}</td></tr>
| |
| </table>
| |
| </div>
| |
| </div> | | </div> |
| {{#css:
| | </center> |
| .item-container {
| | |-| |
| <!-- width: 1200px; -->
| | 次稀有度= |
| width: 95%;
| | <center> |
| margin: 20px auto;
| | <div class="weapon-item-container"> |
| background: linear-gradient(to bottom, #333333, #12121A); /* 修改渐变背景适应深色背景 */
| | [[File:深海访客2.png|center|class=weapon-item-image|alt=深海访客图片2]] |
| box-shadow: 0px 6px 12px rgba(255, 255, 255, 0.1); /* 浅色的阴影增加立体感 */
| | <div class="weapon-item-highlight"></div> |
| border-radius: 10px; | | </div> |
| border: 1px solid #2b2b2b; /* 浅色边框以强调边界 */
| | </center> |
| overflow: hidden;
| | </tabber> |
| | |
| | </includeonly><noinclude> |
| | |
| | {{#CSS: |
| | .tabber { |
| | width: 156px; /* 设置选项卡宽度为156px */ |
| } | | } |
| | | .weapon-item-container { |
| .item-header { | | width: 100%; /* 调整为100%，使其填充父容器 */ |
| | <!-- width: 156px; --> |
| | height: 150px; |
| | background: linear-gradient(to bottom, #000, #333); |
| | border-radius: 5px; |
| | border: 2px solid #555; |
| | position: relative; |
| display: flex; | | display: flex; |
| justify-content: start; | | justify-content: center; |
| align-items: center; | | align-items: center; |
| padding: 20px;
| |
| }
| |
|
| |
| .item-image img {
| |
| width: 150px;
| |
| height: 150px;
| |
| border-radius: 50%;
| |
| border: 4px solid #555;
| |
| }
| |
|
| |
| .item-info {
| |
| margin-left: 20px;
| |
| }
| |
|
| |
| .item-title {
| |
| font-size: 36px;
| |
| font-weight: bold;
| |
| } | | } |
|
| |
|
| .item-rarity { | | .weapon-item-image { |
| font-size: 20px; | | width: 90%; |
| color: gold; | | height: auto; |
| font-weight: bold; | | z-index: 2; |
| margin: 10px 0;
| |
| } | | } |
|
| |
|
| .item-description { | | .weapon-item-highlight { |
| font-size: 17px; | | position: absolute; |
| | bottom: 0; |
| | left: 0; |
| width: 100%; | | width: 100%; |
| | height: 10px; |
| | background-color: #ffb500; |
| } | | } |
|
| |
|
| .item-details table {
| | }} |
| width: 100%;
| |
| background: #222; /* Darker background for the table */
| |
| color: white;
| |
| margin-top: 20px;
| |
| border-collapse: collapse;
| |
| } | |
| | |
| .item-details th, .item-details td {
| |
| padding: 12px 50px; /* Increased left and right padding */
| |
| border-bottom: 1px solid #444; /* Subtle borders for each row */
| |
| }
| |
| | |
| .item-details th {
| |
| background: #333; /* Dark header background */
| |
| font-size: 16px;
| |
| text-align: center;
| |
| width: 30%;
| |
| }
| |
| | |
| .item-details td {
| |
| text-align: left;
| |
| font-size: 14px;
| |
| width: 70%;
| |
| }
| |
| /* 基本样式适用于桌面版 */
| |
| | |
| /* 响应式调整用于移动设备 */
| |
| @media screen and (max-width: 768px) {
| |
| .item-container {
| |
| width: 100%; /* 使用全屏宽度 */
| |
| }
| |
| | |
| .item-header {
| |
| flex-direction: column; /* 项目垂直排列 */
| |
| align-items: center; /* 居中对齐 */
| |
| }
| |
| | |
| .item-image img {
| |
| width: 120px; /* 减小图片尺寸 */
| |
| height: 120px;
| |
| }
| |
| | |
| .item-info {
| |
| margin-left: 0;
| |
| text-align: center; /* 文本居中 */
| |
| }
| |
| | |
| .item-details th, .item-details td {
| |
| padding: 8px; /* 减小内边距 */
| |
| }
| |
| | |
| .item-details th {
| |
| font-size: 14px; /* 减小字体大小 */
| |
| }
| |
| | |
| .item-details td {
| |
| font-size: 12px;
| |
| }
| |
|
| |
|
| .item-rarity {
| |
| display: flex;
| |
| justify-content: center !important;
| |
| }
| |
| }
| |
|
| |
|
| }}
| |
| </includeonly><noinclude>
| |
| {{设定参数 | | {{设定参数 |
| |驱动名称=深海访客 | | |驱动名称=深海访客 |
| |驱动名称日服=Deep Sea Visitor
| | }}{{驱动图鉴/立绘}} |
| |驱动名称国服=深海访客
| |
| |属性=强攻,电
| |
| |稀有度=S
| |
| |一句话介绍=特制的大功率变温型音擎，兼具极强的制冷能力与输出功率，是艾莲惯用的音擎款式。
| |
| |高级属性=暴击率
| |
| |音擎效果=对于[]角色，能够触发以下效果
| |
| |技能名=诸洋之王
| |
| |技能名文本=攻击增加20% ，对敌人施加冰冻后，暴击率增加27%，持续6秒。
| |
| }}{{驱动图鉴/基本信息}} | |
