css实现一个交通工具地铁公交站点价格显示器代码

代码语言:html

所属分类:其他

代码描述:css实现一个交通工具地铁公交站点价格显示器代码

代码标签: css 交通工具 地铁 公交 站点 价格 显示器

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">





    <style>
        body {
          background: black;
          color: white;
          padding: 10px;
        }
        
        .wrapper {
          width: 100%;
          text-align: center;
        }
        
        .line:after {
          content: '';
          width: 100%;
          background: #006cff;
          height: 5px;
          position: absolute;
          left: 0;
          top: 18px;
          z-index: -1;
        }
        
        label {
          padding: 2px 10px 2px 5px;
          border: 1px solid #aaa;
          border-radius: 5px;
          display: inline-block;
          font-size: 16px;
          width: 12px;
          overflow: visible;
          vertical-align: top;
          margin-top: 10px;
          cursor: pointer;
        }
        
        label:active {
          color: yellow;
        }
        
        input[type="checkbox"] {
          appearance: none;
          vertical-align: top;
          width: 20px;
          height: 20px;
          border-radius: 20px;
          display: inline-block;
          background: #FFF;
          border: 5px solid #006cff;
          margin-left: 9px;
          cursor: pointer;
        }
        
        input[type="checkbox"]:first-child {
          margin-left: 0;
        }
        
        input:checked {
          background: red;
        }
        
        .price {
          display: none;
          opacity: 0;
          font-size: 24px;
          color: red;
        }
        
        input:checked ~ div {
          opacity: 1;
        }
        
        input:checked {
          position: relative;
          z-index: 2;
        }
        
        input:checked ~ input:checked ~ .mask {
          background: #000000;
          position: absolute;
          opacity: 0.2;
          width: 100%;
          height: 100%;
          top: 0;
          left: 0;
          z-index: 1;
        }
        
        input[value="s1"]:checked ~ input[value="s1"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s2"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s7"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s8"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s9"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s10"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s11"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s12"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s13"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s14"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s15"]:checked ~ div[data-price="32"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s16"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s17"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s18"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s19"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s20"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s21"]:checked ~ div[data-price="44"] {
          display: block;
        }
        
        input[value="s1"]:checked ~ input[value="s22"]:checked ~ div[data-price="44"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s1"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s2"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s8"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s9"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s10"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s11"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s12"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s13"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s14"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s15"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s16"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s17"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s18"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s19"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s20"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s21"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s2"]:checked ~ input[value="s22"]:checked ~ div[data-price="44"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s1"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s2"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s10"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s11"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s12"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s13"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s14"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s15"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s16"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s17"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s18"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s19"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s20"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s21"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s3"]:checked ~ input[value="s22"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s1"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s2"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s11"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s12"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s13"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s14"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s15"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s16"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s17"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s18"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s19"]:checked ~ div[data-price="32"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s20"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s21"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s4"]:checked ~ input[value="s22"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s1"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s2"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s11"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s12"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s13"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s14"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s15"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s16"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s17"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s18"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s19"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s20"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s21"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s5"]:checked ~ input[value="s22"]:checked ~ div[data-price="40"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s1"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s2"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s11"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s12"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s13"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s14"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s15"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s16"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s17"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s18"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s19"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s20"]:checked ~ div[data-price="32"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s21"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s6"]:checked ~ input[value="s22"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s1"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s2"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s11"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s12"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s13"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s14"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s15"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s16"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s17"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s18"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s19"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s20"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s21"]:checked ~ div[data-price="32"] {
          display: block;
        }
        
        input[value="s7"]:checked ~ input[value="s22"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s1"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s2"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s11"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s12"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s13"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s14"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s15"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s16"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s17"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s18"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s19"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s20"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s21"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s8"]:checked ~ input[value="s22"]:checked ~ div[data-price="36"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s1"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s2"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s3"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s11"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s12"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s13"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s14"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s15"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s16"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s17"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s18"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s19"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s20"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s21"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s9"]:checked ~ input[value="s22"]:checked ~ div[data-price="32"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s1"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s2"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s3"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s4"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s11"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s12"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s13"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s14"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s15"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s16"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s17"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s18"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s19"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s20"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s21"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s10"]:checked ~ input[value="s22"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s1"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s2"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s3"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s4"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s5"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s11"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s12"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s13"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s14"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s15"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s16"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s17"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s18"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s19"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s20"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s21"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s11"]:checked ~ input[value="s22"]:checked ~ div[data-price="28"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s1"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s2"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s3"]:checked ~ div[data-price="24"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s4"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s5"]:checked ~ div[data-price="20"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s6"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s7"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s8"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s9"]:checked ~ div[data-price="16"] {
          display: block;
        }
        
        input[value="s12"]:checked ~ input[value="s10"]:checked ~ div[data-price="16"] {
          dis.........完整代码请登录后点击上方下载按钮下载查看

网友评论0