@charset "utf-8"; .display-none{ display:none; } .title{ border: none; background: none; font-size: 2em; font-weight: bold; } ul{ margin: 0; padding: 0; list-style: none; } /*队伍的整个盒子*/ .formation-box{ width: 648px; background: rgb(119, 167, 255); } /*辅助行*/ .formation-assist{ } /*队伍行*/ .formation-team{ } /*单个怪物*/ .monster{ width: 100px; height: 100px; margin: 0; display: block; float: left; background-image: url(images/001.png); background-repeat: no-repeat; position: relative; } /*怪物属性*/ .property,.subproperty{ position:absolute; left:0;top:0; width: 100px; height: 100px; background-repeat: no-repeat; background-image: url(images/CARDFRAME2.PNG); background-position: 100px 100px; /*默认都不显示*/ } /*怪物-加值*/ .monster .addition{ color: yellow; font-size: 20px; line-height: 20px; font-weight: bold; text-shadow: black 0 0 1px, black 2px 2px 0; position: absolute; left:0; } .monster .addition .hp::before, .monster .addition .atk::before, .monster .addition .rcv::before, .monster .addition ._297::before{ content: "+"; } .monster .addition ._297{ /*297默认不显示*/ display:none; } .monster .addition.has297 .hp, .monster .addition.has297 .atk, .monster .addition.has297 .rcv{ /*当是297时隐藏3维*/ display:none; } .monster .addition.has297 ._297{ /*当是297时显示297*/ display:block; } /*怪物-觉醒*/ .monster .awoken-count{ color: yellow; font-size: 18px; line-height: 24px; font-weight: bold; text-shadow: black 0 0 4px; text-align: center; background-image: url(images/awoken-bg.png); background-size: 27px 30px; width: 27px; height: 30px; position: absolute; right: 0; } /*怪物-等级*/ .monster .level{ color: white; font-size: 18px; text-shadow: black 2px 2px 0; position: absolute; left: 5px; bottom: 0; } .monster .level::before{ content: "Lv"; } /*辅助和队伍的每一只框架*/ .assist, .team, .acquisitus-awoken-icon { display: block; float: left; position: relative; width: 108px; } .formation-box .monster{ margin: 4px; /*留给队长边框的*/ } /* .assist:first-of-type, .team:first-of-type { margin-left: 0px; } */ /*队伍的背景色*/ .formation-assist, .formation-team{ display: inline-block; } .formation-A-box .formation-team{ background-color:pink; } .formation-B-box .formation-team{ background-color:lightblue; } .formation-A-bigbox, .formation-B-bigbox{ position: relative; font-size:0; } .formation-B-bigbox{ margin-top:15px; } /*队伍A、B的文字*/ .formation-A-bigbox::after, .formation-B-bigbox::before{ font-size: 30px; font-weight: bold; text-align: center; line-height: 50px; white-space: pre-wrap; display: inline-block; width: 108px; height: 108px; } .formation-A-bigbox::after{ color:red; background-color:pink; content: "队伍\A A"; } .formation-B-bigbox::before{ color:blue; background-color:lightblue; content: "队伍\A B"; vertical-align:top; } .formation-A-box, .formation-B-box{ display: inline-block; vertical-align:bottom; } .formation-A-box .assist::after, .formation-B-box .assist::before{ text-align: center; font-size: 18px; font-weight: bold; display: block; position: relative; } .formation-A-box .assist::after{ color:red; content: "▼辅助"; } .formation-B-box .assist::before{ color:blue; content: "▲辅助"; } .a-awoken-icon-1 li{ background-image: url(images/sha.png); background-size: 50px 21px; width: 50px; height: 21px; margin-right: 4px; } .a-awoken-icon-2 li{ background-image: url(images/fangzuo.png); background-size: 21px 21px; width: 21px; height: 21px; margin-left: 6px; } .a-awoken-icon-ul li{ float:left; } /*队长的边框*/ .formation-A-box .formation-team .team-leader .monster, .formation-B-box .formation-team .team-leader .monster{ border-radius: 10px; border-width:4px; border-style:solid; margin: 0; } .formation-A-box .formation-team .team-leader .monster{ border-color: red; } .formation-B-box .formation-team .team-leader .monster{ border-color: blue; } /*编辑窗口*/ .blur-bg{ filter:blur(5px); } .edit-box{ background-color: rgba(200,255,200,0.8); text-shadow: white 0 0 2px; position: absolute; left:0; top:0; width:100%; padding: 10px; box-sizing: border-box; width:664px; /*测试时手机上的最大宽度*/ } .edit-box-title{ text-align: center; font-size: 2em; font-weight: bold; } .edit-box .edit-box-title::before{ content: "修改怪物"; } .setting-row{ width: 100%; } .edit-box .search-box::before{ content: "怪物ID"; } .edit-box .search-box .m-id{ box-sizing: border-box; font-size: 25px; height: 40px; width: 100%; } .edit-box .search-box .search-button{ width: 100%; height: 40px; font-size: 25px; } .edit-box .monsterinfo-box{ height: 100px; margin: 5px 0; } .monsterinfo-box .monster{ margin-right:5px; } .monsterinfo-box .monster-id{ display:inline-block; width:150px; } .monsterinfo-box .monster-id::before{ content: "No."; } .monsterinfo-box .monster-rare{ display:inline-block; } .monsterinfo-box .monster-rare::before{ color:gold; text-shadow: black 0 0 3px; } .rare-1::before{content: "★";} .rare-2::before{content: "★★";} .rare-3::before{content: "★★★";} .rare-4::before{content: "★★★★";} .rare-5::before{content: "★★★★★";} .rare-6::before{content: "★★★★★★";} .rare-7::before{content: "★★★★★★★";} .rare-8::before{content: "★★★★★★★★";} .rare-9::before{content: "★★★★★★★★★";} .rare-10::before{content: "★★★★★★★★★★";} .monsterinfo-box .monster-id,.monsterinfo-box .monster-rare,.monsterinfo-box .monster-name{ vertical-align: top; margin:0; height: 34px; font-size: 22px; } .monsterinfo-box .monster-type .type-name{ display:inline-block; } .monsterinfo-box .monster-type .type-icon{ margin-right:3px; } .monsterinfo-box .monster-type .type-name::after{ vertical-align: middle; font-size: 22px; } .edit-box .setting-box .row-mon-level::before{ content: "怪物等级"; display: block; } .edit-box .setting-box .m-level{ font-size: 25px; height: 40px; width: calc(100% - 150px); box-sizing: border-box; } .m-level-btn-max{ height: 40px; width: 145px; box-sizing: border-box; font-size: 25px; } .m-level-btn-max::before{ content: "最高Lv"; } .edit-box .setting-box .row-mon-awoken::before{ content: "怪物觉醒"; } .row-mon-awoken .m-awoken-ul{ height: 32px; } .m-awoken-ul .awoken-icon{ cursor: pointer; } .m-awoken-ul .awoken-icon.unselected-awoken{ opacity: 0.3; } .awoken-icon.awoken-count{ color: yellow; font-size: 22px; line-height: 28px; font-weight: bold; text-shadow: black 0 0 4px; text-align: center; } .edit-box .setting-box .row-mon-addition::before{ content: "怪物加值"; display: block; } .setting-box .m-add-hp,.setting-box .m-add-atk,.setting-box .m-add-rcv{ font-size: 25px; height: 40px; width: calc(100% - 212px); box-sizing: border-box; } .m-add-hp-li::before,.m-add-atk-li::before,.m-add-rcv-li::before{ font-size: 25px; width: 55px; display: inline-block; } .m-add-hp-li::before{content: "HP";} .m-add-atk-li::before{content: "攻击";} .m-add-rcv-li::before{content: "回复";} .m-add-hp-btn-99,.m-add-atk-btn-99,.m-add-rcv-btn-99{ height: 40px; width: 70px; box-sizing: border-box; font-size: 25px; } .m-add-hp-btn-99::before,.m-add-atk-btn-99::before,.m-add-rcv-btn-99::before,.m-add-btn-297::before{ content: "+"; } .m-add-btn-297{ float:right; width: 85px; height: 120px; box-sizing: border-box; font-size: 25px; } .edit-box .setting-box .row-mon-latent::before{ content: "潜在觉醒"; } .m-latent-ul{ text-align: center; font-size: 0; } .m-latent-ul .latent-icon{ margin-left: 12px; } .m-latent-ul .latent-icon:first-of-type{ margin-left: 0; } .m-latent-allowable-ul{ margin-top: 5px; } .m-latent-allowable-ul .latent-icon{ cursor: pointer; } .m-latent-allowable-ul .latent-icon.unselected-latent{ cursor: default; opacity: 0.3; } .latent-icon-11, .latent-icon-13, .latent-icon-14, .latent-icon-15, .latent-icon-16, .latent-icon-17, .latent-icon-18, .latent-icon-19, .latent-icon-20, .latent-icon-21, .latent-icon-22, .latent-icon-23, .latent-icon-24{ cursor: pointer; } .edit-box .button-box .button-done::after{ content: "确认修改"; }