pc_kingdee_large_screen/investment/styles/investHomeBig.css

html,
body {
  /* min-width: 7640px; */
  width: 7680px;
  height: 2160px;
  font-size: 20px;
  color: #fff;
  font-family: 'Microsoft YaHei', 'Helvetica Neue', Helvetica, 'PingFang SC',
    'Hiragino Sans GB', Arial, sans-serif;
  height: 100vh;
  overflow-y: hidden;
}
*{
  padding: 0;
  margin: 0;
}
[v-cloak] {
  display: none;
}
#app{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
  height: 100%;     
}
#app>div{
  width: 100%;
  height: 100%;
}
/* 公共 */
      /* 宽高纵横比 */
      .aspect-auto {
        aspect-ratio: auto;
      }
      .aspect-square {
        aspect-ratio: 1 / 1;
      }
      .aspect-video {
        aspect-ratio: 16 / 9;
      }
      /* aspect-[4/3] */

      /* 居中 */
      .mx-auto {
        margin: 0 auto;
      }

      /* 设置容器内的列数/每列距离 */
      .columns-1 {
        columns: 1;
      }
      /* columns-[20px] */

      /* 盒子模型 */
      .box-border {
        box-sizing: border-box;
      }
      .box-content {
        box-sizing: content-box;
      }
      /* 消失 */
      .hidden {
        display: none;
      }

      /* 块级元素 */
      .block {
        display: block;
      }
      /* 行内块 */
      .inline-block {
        display: inline-block;
      }
      /* 行内元素 */
      .inline {
        display: inline;
      }

      /* 弹性布局 */
      .flex {
        display: flex;
      }
      /* 主轴起点在左边 */
      .flex-row {
        flex-direction: row;
      }
      /* 主轴起点在右边 */
      .flex-row-reverse {
        flex-direction: row-reverse;
      }
      /* 主轴竖向排列，在上面 */
      .flex-col {
        flex-direction: column;
      }
      /* 主轴竖向排列，在下面 */
      .flex-col-reverse {
        flex-direction: column-reverse;
      }
      /* 自动换行 */
      .flex-wrap {
        flex-wrap: wrap;
      }
      /* 自动换行下起点 */
      .flex-wrap-reverse {
        flex-wrap: wrap-reverse;
      }
      /* 不换行 */
      .flex-nowrap {
        flex-wrap: nowrap;
      }
      /* 弹性成长 */
      .grow {
        flex-grow: 1;
      }
      /* 不允许弹性成长 */
      .grow-0 {
        flex-grow: 0;
      }
      /* 主轴从左开始 */
      .justify-start {
        justify-content: flex-start;
      }
      /* 主轴从右开始 */
      .justify-end {
        justify-content: flex-end;
      }
      /* 主轴剧中 */
      .justify-center {
        justify-content: center;
      }
      /* 主轴两端无间隔 */
      .justify-between {
        justify-content: space-between;
      }
      /* 主轴两端有间隔 */
      .justify-around {
        justify-content: space-around;
      }
      /* 所有间隔相等 */
      .justify-evenly {
        justify-content: space-evenly;
      }
      /* 纵向起点最上方 */
      .items-start {
        align-items: flex-start;
      }
      /* 纵向起点最下方 */
      .items-end {
        align-items: flex-end;
      }
      .items-center {
        align-items: center;
      }
      /* 网格布局 */
      .grid {
        display: grid;
      }
       /* 有几列 */
      .grid-cols-4{
         grid-template-columns: repeat(4, minmax(0, 1fr));  
         grid-template-columns: repeat(2, 1fr);     
      }
       /* 有几行 */
      .grid-rows-3{
          grid-template-rows: repeat(3, minmax(0, 1fr)); 
          grid-template-rows: repeat(3, 1fr);     
      }
      /* 容器中的内容上下布局 */
      .grid-center{
         align-items: center;
      }
       /* 间距 */
      .gap-7{
         gap: 1.75rem;       
      }
      /* 允许弹性成长 */
      .shrink {
        flex-shrink: 1;
      }
      /* 不允许弹性成长 */
      .shrink-0 {
        flex-shrink: 0;
      }
      /* 不允许成长也不允许收缩 */
      .flex-none {
        flex: none;
      }
      /* 浮动布局 */
      .float-right {
        float: right;
      }
      .float-left {
        float: left;
      }
      .clear-both {
        clear: both;
      }

      /* 溢出 */
      .overflow-auto {
        overflow: auto;
      }
      .overflow-hidden {
        overflow: hidden;
      }
      .overflow-scroll {
        overflow: scroll;
      }
      .overflow-x-auto {
        overflow-x: auto;
      }
      .overflow-y-auto {
        overflow-y: auto;
      }

      /* 定位 */
      .fixed {
        position: fixed;
      }
      .absolute {
        position: absolute;
      }
      .relative {
        position: relative;
      }
      .top-0 {
        top: 0px;
      }
      .right-0 {
        right: 0px;
      }
      .bottom-0 {
        bottom: 0px;
      }
      .left-0 {
        left: 0px;
      }
      /* top-[3px] */
      /* z-[100] */

      /* 显示隐藏未脱离文档流 */
      .visible {
        visibility: visible;
      }
      .invisible {
        visibility: hidden;
      }

      /* 内边距 */
      .p-0 {
        padding: 0px;
      }
      .px-0 {
        padding-left: 0px;
        padding-right: 0px;
      }
      .py-0 {
        padding-top: 0px;
        padding-bottom: 0px;
      }
      .pt-0 {
        padding-top: 0px;
      }
      .pr-0 {
        padding-right: 0px;
      }
      .pb-0 {
        padding-bottom: 0px;
      }
      .pl-0 {
        padding-left: 0px;
      }
      /* p-[5px] */

      /* 外边距 */
      .m-0 {
        margin: 0px;
      }
      .mx-0 {
        margin-left: 0px;
        margin-right: 0px;
      }
      .my-0 {
        margin-top: 0px;
        margin-bottom: 0px;
      }
      .mt-0 {
        margin-top: 0px;
      }
      .mr-0 {
        margin-right: 0px;
      }
      .mb-0 {
        margin-bottom: 0px;
      }
      .ml-0 {
        margin-left: 0px;
      }
      /* m-[5px] */

      /* 宽度 */
      .w-full {
        width: 100%;
      }
      .w-screen {
        width: 100vw;
      }
      /* w-[32rem] */
      /* min-w-[50%] */
      /* max-w-[50%] */

      /* 高度 */
      .h-full {
        height: 100%;
      }
      .h-screen {
        height: 100vh;
      }
      /* h-[32rem] */
      /* min-h-[50%] */
      /* max-h-[32rem] */

      /* 字体 */
      .text-xs {
        font-size: 0.75rem; /* 12px */
        line-height: 1rem; /* 16px */
      }
      .text-sm {
        font-size: 0.875rem; /* 14px */
        line-height: 1.25rem; /* 20px */
      }
      .text-base {
        font-size: 1rem; /* 16px */
        line-height: 1.5rem; /* 24px */
      }
      .text-lg {
        font-size: 1.125rem; /* 18px */
        line-height: 1.75rem; /* 28px */
      }
      .text-xl {
        font-size: 1.25rem; /* 20px */
        line-height: 1.75rem; /* 28px */
      }
      .text-2xl {
        font-size: 1.5rem; /* 24px */
        line-height: 2rem; /* 32px */
      }
      .text-3xl {
        font-size: 1.875rem; /* 30px */
        line-height: 2.25rem; /* 36px */
      }
      .text-4xl {
        font-size: 2.25rem; /* 36px */
        line-height: 2.5rem; /* 40px */
      }
      .text-5xl {
        font-size: 3rem; /* 48px */
        line-height: 1;
      }
      .text-6xl {
        font-size: 3.75rem; /* 60px */
        line-height: 1;
      }
      .text-7xl {
        font-size: 4.5rem; /* 72px */
        line-height: 1;
      }
      .text-8xl {
        font-size: 6rem; /* 96px */
        line-height: 1;
      }
      .text-9xl {
        font-size: 8rem; /* 128px */
        line-height: 1;
      }
      /* text-[14px] */
      /* 字体粗细font-weight */
      /* font-[1100] */
      /* https://tailwindcss.com/docs/font-weight */
      /* 字体间距letter-spacing */
      /* tracking-[.25em] */
      /* 行高line-height */
      /* leading-[3rem] */
      /* 无列表样式 */
      .list-none {
        list-style-type: none;
      }
      /* 小圆点 */
      .list-disc {
        list-style-type: disc;
      }
      /* 数字列表 */
      .list-decimal {
        list-style-type: decimal;
      }
      .text-left {
        text-align: left;
      }
      .text-center {
        text-align: center;
      }
      .text-right {
        text-align: right;
      }
      /* 所有文本头尾对齐 */
      .text-justify {
        text-align: justify;
      }
      /* 文本颜色 */
      /* text-[#50d71e] */
      /* https://tailwindcss.com/docs/text-color */
      /* 下划线 */
      .underline {
        text-decoration-line: underline;
      }
      /* 上划线 */
      .overline {
        text-decoration-line: overline;
      }
      /* 中划线 */
      .line-through {
        text-decoration-line: line-through;
      }
      /* 无划线 */
      .no-underline {
        text-decoration-line: none;
      }
      /* 全小写 */
      .lowercase {
        text-transform: lowercase;
      }
      /* 全大写 */
      .uppercase {
        text-transform: uppercase;
      }
      /* 首字母大写 */
      .capitalize {
        text-transform: capitalize;
      }