본문 바로가기

분류 전체보기221

html label 태그로 폼 요소의 캡션 만들기 html label 태그로 폼 요소의 캡션 만들기 네 안녕하세요, 이번 포스팅에서는 html에서 쓰이는 label 태그를 이용하여 폼 요소의 캡션을 만들어보려고 합니다. html에서 캡션이란 어떤 표나 그림 등에 대한 설명문입니다. 우리가 프런트엔드나 백엔드 코딩을 할 때 무언가를 설명하기 위해서 주석문을 넣곤 합니다. 그러한 것 처럼 어떤 그림이나 표 등의 시각적인 자료를 넣었을 때 이것이 어떤 것인지를 사용자들에게 알리기 위해서 부가적인 설명문을 붙입니다. 그리고 폼에서는 이러한 캡션과 기타 폼 요소를 한 단위로 묶어서 표현을 하여 문서의 가독성을 높입니다. 그럼 지금부터 같이 한 번 알아보실까요? 1. 캡션 지정 및 캡션과 폼 요소 연결하기 : label 태그와 for 속성 이용 우리가 label .. 2023. 3. 6.
html 폼 만들기 7 - select, option 태그로 콤보박스 만들기 html 폼 만들기 7 - select, option 태그로 콤보박스 만들기 네 안녕하세요, 이번 포스팅에서는 콤보박스를 만들어보도록 하겠습니다. 콤보박스도 정말 많이 쓰이는 선택형 입력 폼의 일종입니다. 앞서 포스팅을 한 체크박스와 라디오 버튼 만큼이나 많이 쓰입니다. 그래서 되게 중요한 요소입니다. 그럼 지금부터 시작하도록 하겠습니다. 1. 콤보 박스 만들기 : select, option 태그 이용 콤보 박스는 우리가 흔히 말하는 드롭다운 단추입니다. 하나의 단추 안에 여러 개의 선택지가 있다고 하여 콤보 박스라 부르고, 그 콤보 박스를 누르면 선택지가 마치 떨어지듯 쭉 ~ 내려와서 선택지가 보인다고 하여 드롭박스라고도 부릅니다. 그리고 콤보 박스는 select라는 속성으로 테두리를 만들고, opti.. 2023. 3. 4.
html 폼 만들기 6 - 라디오 버튼 만들기 html 폼 만들기 6 - 라디오 버튼 만들기 네 안녕하세요, 이번 포스팅에서는 라디오 버튼에 대해 알아보도록 하겠습니다. 라디오 버튼 역시 선택형 입력 폼의 일종입니다. 그리고 체크박스만큼이나 자주 쓰입니다. 그래서 그만큼 중요한 선택형 입력 폼 양식입니다. 그럼 지금부터 시작하도록 하겠습니다. 1. 라디오 버튼 만들기 : input type = "radio" 라디오 버튼은 radio 속성을 이용해서 만듭니다. 또한, 라디오 버튼은 name 속성의 값이 같은 라디오 버튼끼리 하나의 그룹을 형성하고 묶입니다. 그리고 라디오 버튼 역시 체크박스처럼 checked 속성이 존재하는 칸이 있다면 웹 페이지를 여는 순간부터 체크표시가 되어서 출력이 됩니다. 그럼 간단한 예제를 통하여 같이 알아보실까요? 먹고 싶은.. 2023. 3. 4.
html 폼 만들기 5 - 체크박스 만들기 html 폼 만들기 5 - 체크박스 만들기 네 안녕하세요, 이번 포스팅에서는 체크박스를 만드는 방법에 대하여 알아보겠습니다. 체크박스는 선택형 입력 기능 중 한 기능이며, 선택형 입력이란 우리가 흔히 설문조사나 시험을 볼 때 4지선다나 5지선다형 문제를 푸는 것처럼 무언가를 선택을 할 수 있도록 하는 폼을 만드는 것입니다. 그래서 이걸 이용하게 되면 나중에 우리가 웹 사이트를 만들거나 어플 등을 만들고 후에 만족도 조사 같은 걸 할 때 이런 식으로 선택형 입력 폼을 만들어서 선호도 등을 조사하고 관리를 하는 데 도움을 줄 수 있기 때문에 매우 유용한 기능입니다. 그리고 무언가를 변환시키거나 합성시키는 등의 유머사이트 등에서도 이러한 선택형 폼을 써서 소비자들의 취향대로 결과물을 얻을 수 있도록 하기도 합.. 2023. 3. 4.