/* 文件列表item */ .file-choose-list-item { position: relative; display: inline-block; vertical-align: top; padding: 8px 8px; margin: 5px 0; cursor: pointer; } .file-choose-list-item:hover { background-color: #F7F7F7; } /* 文件列表图片 */ .file-choose-list-item-img { width: 90px; height: 90px; background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 3px; overflow: hidden; position: relative; background-color: #eee; } .file-choose-list-item-img.img-icon { background-size: inherit; background-color: transparent; } .file-choose-list-item.active .file-choose-list-item-img:after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, 0.3); } /* 文件列表名称 */ .file-choose-list-item-name { width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #333; font-size: 12px; text-align: center; margin-top: 12px; } /* 文件列表复选框 */ .file-choose-list-item-ck { position: absolute; right: 8px; top: 8px; } .file-choose-list-item-ck .layui-form-checkbox { padding: 0; } /* 文件列表操作菜单 */ .file-choose-oper-menu { background-color: #fff; position: absolute; left: 8px; top: 8px; border-radius: 2px; box-shadow: 0px 0px 10px rgba(0, 0, 0, .15); transition: all .3s; overflow: hidden; transform: scale(0); transform-origin: left top; visibility: hidden; } .file-choose-oper-menu.show { transform: scale(1); visibility: visible; } /* 文件列表操作菜单item */ .file-choose-oper-menu-item { color: #555; padding: 6px 5px; font-size: 14px; min-width: 70px; text-align: center; cursor: pointer; display: block; } .file-choose-oper-menu-item:hover { background-color: #eee; } /** 文件列表为空时样式 */ .file-choose-empty { text-align: center; color: #999; padding: 50px 0; } .file-choose-empty .layui-icon { font-size: 60px; display: block; margin-bottom: 8px; }