SBUx

기존 홈페이지 바로가기

SBUx

SBUx로 만드는 간단한 업무화면! SBUx Template 바로가기 화살표

Input 텍스트 입력 필드

텍스트 입력 필드는 HTML에서 사용자로부터 데이터를 입력받는 가장 기본적인 요소 중 하나입니다.
다양한 속성과 이벤트를 통해 보안 설정, 입력 포맷 설정, 버튼 영역 설정 등을 제어할 수 있습니다.

행정안전부 로고 전자정부 디자인 시스템 보러가기 전자정부 디자인 시스템 바로가기

API

Attribute
Discription
show-clear-button
내용물 바로 삭제가 가능한 'x' 마크를 나타냅니다. 여러 브라우저에서도 기능적으로 나타냅니다.
password
텍스트 입력 시 보안이 필요한 경우 사용합니다. 주로 비밀번호 입력 시 사용합니다.
mask
특정한 입력 포맷을 만들기 위해 사용합니다. 지정한 포맷에서 입력값이 벗어나지 않도록 제한합니다.
button-front-text
검색에 대한 이벤트 버튼을 추가하고 싶을 때 사용합니다. 영역 앞 쪽으로 버튼이 나타납니다.
button-back-text
검색에 대한 이벤트 버튼을 추가하고 싶을 때 사용합니다. 영역 뒤 쪽으로 버튼이 나타납니다.
tooltip
UI 요소 위에 마우스를 올리거나 포커스할 때 간단한 정보를 나타냅니다.
popover
UI 요소와 관련된 추가 정보를 표시하는 컴포넌트입니다. 툴팁보다 더 많은 내용과 인터랙션을 담을 수 있습니다.
데모 아이콘 카카오톡 바로가기 아이콘