Forms

File Input

semantic HTML

파일 선택과 유형·크기 검증을 제공합니다.

stablefreeSince 0.3

Live example

Attachment

<label id="attachment-label">Attachment</label>
<div data-standard-component="file-input" label="Attachment" name="attachment" accept=".png,.jpg,.pdf" max-size="5000000" aria-labelledby="attachment-label"><label>Attachment<input type="file" name="attachment" accept=".png,.jpg,.pdf"></label></div>

Variants and sizes

The pattern inherits theme and density tokens. Use compact, comfortable, or roomy density when the surrounding screen requires it.

compactcomfortableroomy

Public API

Contract	Value
Implementation	`semantic HTML`
Status	`stable`
License	`free`
Since	`0.3`
HTML contract	`Native HTML elements and attributes`
Events	`Native browser events`

Accessibility

허용 형식과 크기 오류를 alert로 안내하고 required, reset, disabled 상태를 폼에 반영합니다.

Server template guidance

<!-- Render the semantic HTML on the server. Load enhancement JavaScript only when this interaction is needed. -->