This commit is contained in:
@@ -92,9 +92,24 @@ export default {
|
||||
display: block;
|
||||
.upload-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
/* 文件列表换行后,右侧提示文字仍与按钮首行对齐(不再整体垂直居中) */
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
/*
|
||||
* Upload 根节点必须是 block,不能是 flex/inline-flex。
|
||||
* view-ui-plus 的 Upload 内部是两个兄弟节点:
|
||||
* .ivu-upload-select(「选择文件」触发器) + ul.ivu-upload-list(已上传文件列表)
|
||||
* 根节点一旦是 flex,作为 flex 项的 ul 就会被排到按钮同一行的右侧,
|
||||
* 附件名紧贴按钮右边(即「附件在按钮旁边」)。改回 block 后,
|
||||
* ul 恢复块级流,自然落到按钮下方一行。
|
||||
*/
|
||||
:deep(.ivu-upload) {
|
||||
display: block;
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
/* 只让触发器内部水平对齐,不影响它的兄弟节点 */
|
||||
:deep(.ivu-upload-select) {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
@@ -110,7 +125,8 @@ export default {
|
||||
margin-left: 10px;
|
||||
color: #f90;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
/* 与「选择文件」按钮同高,保证首行视觉居中对齐 */
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user