关联输出

关联输出 · ThinkPHP6.0完全开发手册 · 看云

  1.     .dimmer {
  2.         box-sizing: content-box;
  3.         display: flex;
  4.         position: absolute;
  5.         top: 0 !important;
  6.         left: 0 !important;
  7.         width: 100%;
  8.         height: 100%;
  9.         text-align: center;
  10.         vertical-align: middle;
  11.         padding: 0;
  12.         background-color: #FFFFFF;
  13.         opacity: 1;
  14.         line-height: 1;
  15.         animation-fill-mode: both;
  16.         animation-duration: .5s;
  17.         transition: background-color .5s linear;
  18.         flex-direction: column;
  19.         align-items: center;
  20.         justify-content: center;
  21.         user-select: none;
  22.         will-change: opacity;
  23.         z-index: 1000;
  24.     }
  26.     .loader {
  27.         box-sizing: content-box;
  28.         display: block;
  29.         position: absolute;
  30.         top: 50%;
  31.         left: 50%;
  32.         margin: 0;
  33.         text-align: center;
  34.         z-index: 1000;
  35.         -webkit-transform: translateX(-50%) translateY(-50%);
  36.         transform: translateX(-50%) translateY(-50%);
  37.     }
  39.     .loader:before {
  40.         position: absolute;
  41.         content: '';
  42.         top: 0;
  43.         left: 50%;
  44.         width: 50px;
  45.         height: 50px;
  46.         margin: 0 0 0 -25px;
  47.         border-radius: 50px;
  48.         border: 4px solid rgba(0, 0, 0, .1);
  49.     }
  51.     .loader:after {
  52.         position: absolute;
  53.         content: '';
  54.         top: 0;
  55.         left: 50%;
  56.         width: 50px;
  57.         height: 50px;
  58.         margin: 0 0 0 -25px;
  59.         animation: loader .6s linear;
  60.         animation-iteration-count: infinite;
  61.         border-radius: 50px;
  62.         border: 4px solid transparent;
  63.         border-top-color: #767676;
  64.         box-shadow: 0 0 0 1px transparent;
  65.     }
  67.     @keyframes loader {
  68.         from {
  69.             -webkit-transform: rotate(0deg);
  70.             transform: rotate(0deg);
  71.         }
  72.         to {
  73.             -webkit-transform: rotate(360deg);
  74.             transform: rotate(360deg);
  75.         }
  76.     }
  78.     body {
  79.         margin: 0;
  80.         padding: 0;
  81.         height: 100vh;
  82.         overflow: hidden;
  83.     }
  85.     #main {
  86.         display: block !important;
  87.         height: 100vh;
  88.         overflow: hidden;
  89.     }

.wwads-horizontal, .wwads-vertical { background-color: #f4f8fa; padding: 5px; min-height: 120px; margin-top: 20px; box-sizing: border-box; border-radius: 3px; font-family: sans-serif; display: flex; min-width: 150px; position: relative; overflow: hidden; } .wwads-horizontal { flex-wrap: wrap; justify-content: center; } .wwads-vertical { flex-direction: column; align-items: center; padding-bottom: 32px; } .wwads-horizontal a, .wwads-vertical a { text-decoration: none; } .wwads-horizontal .wwads-content, .wwads-horizontal .wwads-img, .wwads-vertical .wwads-content, .wwads-vertical .wwads-img { margin: 5px; } .wwads-horizontal .wwads-content { flex: 130px; text-align: left; } .wwads-vertical .wwads-content { margin-top: 10px; text-align: left; } .wwads-content .wwads-text, .wwads-horizontal .wwads-text { font-size: 14px; line-height: 1.4; color: #0e1011; -webkit-font-smoothing: antialiased; word-break: break-word; font-family: “BlinkMacSystemFont”,”Segoe UI”, “Microsoft Jhenghei”, “Microsoft Yahei”, arial, sans-serif; } .wwads-content strong,.wwads-content b { padding: 1px 1px; border-bottom: 2px solid #ec515b; color:#202124; font-family: “BlinkMacSystemFont”,”Segoe UI”, “Microsoft Jhenghei”, “Microsoft Yahei”, arial, sans-serif; } .wwads-horizontal .wwads-poweredby, .wwads-vertical .wwads-poweredby { display: flex; align-items: center; margin-top: 1em; } .wwads-vertical .wwads-poweredby { position: absolute; left: 10px; bottom: 10px; display: flex; align-items: center; } .wwads-horizontal .wwads-poweredby .wwads-logo, .wwads-vertical .wwads-poweredby .wwads-logo { background: url(“data:image/svg+xml;charset=utf-8,%3Csvg viewBox=’0 0 130 130’ xmlns=’http://www.w3.org/2000/svg‘ xml:space=’preserve’ version=’1.1’%3E%3Cpath d=’m130,60.8c-1.2,-18.7 -10.3,-35.3 -24.1,-46.4c-11.1,-9 -25.3,-14.4 -40.8,-14.4c-0.6,0 -1.1,0 -1.6,0c-3.3,0.1 -6.6,0.4 -9.8,1c-30.5,5.4 -53.7,32 -53.7,64c0,1.9 0.1,3.7 0.2,5.6c2.5,29.5 24.7,53.4 53.4,58.5c2.4,0.4 4.8,0.7 7.3,0.9c0.8,0 1.7,0.1 2.5,0.1c0.5,0 1.1,0 1.6,0c34,0 62,-26.2 64.8,-59.5c0.2,-1.8 0.2,-3.7 0.2,-5.6c0.1,-1.4 0.1,-2.8 0,-4.2zm-97.6,9.8c3.7,7.7 11.5,13 20.6,13c0.3,0 0.5,0 0.8,0l0,9.8c-0.3,0 -0.5,0 -0.8,0c-14.6,0 -26.9,-9.6 -31,-22.8c-1,-3.1 -1.5,-6.4 -1.5,-