[HTML 기초] 5. HTML 태그 - 폼 관련 태그(button, input, textarea, select, option, label, form)
1. 폼 관련 태그 사용자의 입력을 받아 제출할 수 있는 양식을 폼이라고 하고, 이러한 동작을 수행하는 태그들을 알아보겠습니다. 한 사이트에서 로그인할 때를 생각해보세요. 이때 아이디와 비밀번호를 입력하고 로그인 버튼을 누르는 과정이 사용자의 입력을 받아 해당 사이트의 서버로 제출하는 것입니다. 버튼 - button 속성 name: 버튼의 이름. 제출 시 value와 데이터를 구성함 type: submit, reset, button 중 하나 선택. 제출용이 아니라면 button으로 지정하는 것이 좋음 버튼 입력 - input 사용자의 데이터를 받을 수 있는 입력 창으로, type 속성을 이용해 꽤 많은 기능을 구현할 수 있음. 속성 참고: https://developer.mozilla.org/ko/doc..
[HTML 기초] 4. HTML 태그 - 멀티미디어, 표 관련 태그 (img, video, audio, table, thead, tbody, tr, th, td, caption)
1. 멀티미디어 관련 태그 이미지와 비디오 태그를 보면, 열린 태그와 닫힌 태그 두 개로 이루어지지 않고 하나의 태그로 이루어진 것을 볼 수 있습니다. 이렇게 하나의 태그만 가지고도 사용할 수 있는 것들이 있습니다. 주로 열린 태그와 닫힌 태그 사이에 아무런 내용이 없을 경우 하나의 태그로 해결합니다. 이미지 - image 속성 참고: https://developer.mozilla.org/ko/docs/Web/HTML/Element/img#%ED%8A%B9%EC%84%B1 src : 이미지의 경로 지정 (필수) alt : 이미지에 대한 설명, 이미지를 표시할 수 없는 경우 보여지는 값 (선택) 비디오 - video 속성 참고: https://developer.mozilla.org/ko/docs/Web/H..
[HTML 기초] 3. HTML 태그 - 텍스트 관련 태그(h1~h6, p, b, br, ol, ul, li, a)
1. 태그의 구조 기본적인 태그의 구조는 아래와 같습니다. 앞부분을 열린 태그(Opening tag), 뒷부분을 닫힌 태그(Closing tag)가 하고 그 사이에 내용이 들어갑니다. 열린 태그 안에 속성(Attribute) 값이 들어가는데 이를 활용해 태그를 효율적으로 활용할 수 있습니다. 열린 태그와 닫힌 태그, 그 사이의 내용을 모두 포함한 것을 요소(Element)라고 합니다. 참고) 요소를 구성하는 태그 사실 위의 그림은 요소의 구조라고 하는 것이 정확합니다. 요소는 웹 페이지를 구성하는 것으로, 요소를 구성하는 것 중 하나가 태그인 것이지요. 하지만 여기서는 태그를 사용하는 방식을 이해하기 위해 태그의 구조라고 소개했습니다. 요소에 대한 구체적인 내용이 궁금하다면 여기를 참고하세요. 2. 기초..