样式(Styling)
CSS 选择器
以下CSS选择器可以在样式表中用于定位组件的各个部分和状态。 有关如何对组件进行样式设置的更多详细信息,请参阅Styling documentation。
- 根元素
-
vaadin-upload
状态(States)
- 禁用文件拖放区域的上传组件
-
vaadin-upload[nodrop] - 文件拖拽到上传组件
-
vaadin-upload[dragover] - 文件拖拽到上传组件并已通过验证
-
vaadin-upload[dragover-valid]
按钮和拖放标签(Button and Drop Label)
- 按钮和拖放标签包装器
-
vaadin-upload::part(primary-buttons) - 上传按钮
-
vaadin-upload> vaadin-button - 上传按钮文本
-
vaadin-upload> vaadin-button::part(label) - 鼠标悬停时的按钮
-
vaadin-upload> vaadin-button:hover - 获得焦点的按钮
-
vaadin-upload> vaadin-button[focused] - 禁用按钮
-
vaadin-upload> vaadin-button[disabled] - 拖放标签
-
vaadin-upload::part(drop-label) - 拖放标签文本
-
vaadin-upload> [slot="drop-label"] - 拖放标签图标包装器
-
vaadin-upload> [slot="drop-label-icon"] - 拖放标签图标
-
vaadin-upload> [slot="drop-label-icon"]::before
文件(File)
- 文件元素
-
vaadin-upload-file - 文件内容包装器
-
vaadin-upload-file::part(row) - 状态图标和元信息包装器
-
vaadin-upload-file::part(info) - 元信息包装器
-
vaadin-upload-file::part(meta) - 文件名称
-
vaadin-upload-file::part(name) - 状态文本
-
vaadin-upload-file::part(status) - 错误消息
-
vaadin-upload-file::part(error)
文件状态(File States)
- 获得焦点的文件
-
vaadin-upload-file[focused] - 鼠标悬停时的文件
-
vaadin-upload-file:hover - 成功上传的文件
-
vaadin-upload-file[complete] - 上传失败有错误的文件
-
vaadin-upload-file[error] - 正在上传的文件
-
vaadin-upload-file[uploading] - 剩余时间未知估算的文件
-
vaadin-upload-file[indeterminate] - 图标:上传完成
-
vaadin-upload-file::part(done-icon) - 图标:上传失败
-
vaadin-upload-file::part(warning-icon)