본문 바로가기

form 요소

14. select태그 _ 목록 선택 select는 목록을 선택하는 태그입니다. 자주 쓰이는 셀렉트바를 생성합니다. 우리가 흔히 태어난 년도를 선택할때나 살고있는 도시를 선택할때 쓰는 태그입니다. 기본형을 봅시다. 선택지1 선택지2 selected 앞에서 본 radio나 checkbox와 마찬가지로 처음부터 선택지를 기본값으로 선택이 가능합니다. 선택하고자 하는 option 뒤에 selected를 넣어줍니다. 똑같은 select에 selected를 넣었을때와 넣지 않았을때를 비교해 봅시다. 선택 딸기 바나나 선택 딸기 바나나 선택 딸기 바나나 선택 딸기 바나나 optgroup optgroup은 선택지를 구분해주는 역할입니다. 각각의 option들을 그룹지어야 할 경우 사용합니다. 선택 딸기 바나나 당근 오이 선택 딸기 바나나 당근 오이 mu.. 더보기
13. button태그 _ 버튼 생성 button태그는 버튼을 생성해 줍니다. input에서 button타입을 썼을때와 마찬가지로요. button태그는 input과는 달리 짝궁으로 열고 닫는 태그입니다. 생긴건 같아도 두개의 가장 큰 차이점은 여기에 있습니다. button은 과 사이에 텍스트를 넣을 수 있고 다른 태그도 넣을 수 있어서 다양하게 커스텀이 가능합니다. 한마디로 꾸미기 쉽습니다. button name type button에도 type이 있으므로 적어줘야 합니다. 일반적인 기능의 button은 type="button"을 넣어주는데요. 이 태그를 넣어주지 않으면 이 버튼은 기본값을 받아 type이 submit으로 나옵니다. 보기에는 차이가 없어 보입니다. 하지만 기능적으로 차이가 있으니 꼭 넣어 줍시다. 전 button이에요 전 s.. 더보기
12. input태그 _ form 요소 input태그는 사용자가 입력한 정보를 저장해서 보내주는 form을 이루는 요소중 하나입니다. form element는 단순하게 form태그 안에 들어가는 요소들이라고 보면 되는데요. input은 그 중 가장 다양한 폼을 가진 태그입니다. input은 상당히 단순한 형태이지만 type에 따라 여러가지 폼들이 나타납니다. 일단 기본형을 확인해볼까요. text input의 가장 기본 타입인 text입니다. 우리가 흔히보는 텍스트를 입력하는 폼이 이것입니다. 가끔 이 텍스트박스에 글자가 미리 입력되있는 경우가 있는데요. value와 palceholder로 나뉩니다. 간단히 보자면 value는 클릭후 글자 입력시 수동으로 글자를 지워야 하고 placeholder는 클릭후 글자를 입력하면 자동으로 글자가 사라집니.. 더보기