zoukankan      html  css  js  c++  java
  • iview 一行显示2列,select多选横向滚动条,兼容下拉图标

    .ivu-form { display: flex; flex-wrap: wrap; .ivu-form-item { 50%; margin-bottom:14px; .ivu-form-item-error-tip{ color: #F56C6C; font-size: 12px; line-height: 1; padding-top: 4px; position: absolute; top: 100%; left: 0; padding-top: 2px; } .ivu-select-multiple{ .ivu-select-selection{ &>div{ display: flex; flex-wrap: nowrap; overflow-y: hidden; overflow-x: auto; position: absolute; line-height: normal; white-space: normal; top: 50%; transform: translateY(-50%); calc(100% - 20px); } // scrollbar ::-webkit-scrollbar { 4px; height: 4px; } ::-webkit-scrollbar-button { display: none } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: var(--font-s-a-20); //滚动条颜色 border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: var(--font-s-a-80); //滚动条颜色 } .ivu-select-arrow{ display: none; // 自带的图标未知有问题隐藏掉自己画一个 } &:before{ font-family: psi-design-fonts; position: absolute; top: 50%; right: 8px; line-height: 1; transform: translateY(-50%); font-size: 12px; color: var(--font-s); content:"f116"; } } .ivu-tag{ height: 20px; line-height: 18px; margin: 0 4px 0 0; min- 60px; } } } .ivu-form-item-100 { 100%; } }

  • 相关阅读:
    Virtualbox中不能为虚拟机打开一个新任务的原因及解决方法
    CSS 制作三角形原理剖析
    java 执行jar指定log4j.properties文件位置
    Git submodules
    IO模型
    Error during WebSocket handshake 403
    Proto(协议缓冲区)
    gRPC
    Node.js 模块机制
    Node.js 模块机制及常见面试问题解答
  • 原文地址:https://www.cnblogs.com/m7777/p/15510562.html
Copyright © 2011-2022 走看看