여러 줄을 입력하는 텍스트 영역 태그 태그 form에서 텍스트를 여러 줄 입력하는 영역 ex) 게시판에서 글을 입력하거나 회원 가입 양식에서 사용자 약관을 표시할 때 사용 기본형 : 내용 자주 사용 하는 속성 : cols : ⓐ 텍스트 영역의 가로 너비를 문자 단위로 지정함 ⓑ 지정하는 글자 수는 영문자를 기준으로 함 (한글 1글자 = 영문자 2글자) ex) col="100" 으로 지정할 경우 한글은 50글자에 해당함 rows : ⓐ 텍스트 영역의 세로 길이를 줄 단위로 지정함 ⓑ 지정한 숫자보다 줄 갯수가 많아지면 스크롤 막대가 생김 ⓒ 지정하는 글자 수는 사용하는 글꼴이나 글자 크기에 따라 달라질 수 있어서 정확하게 크기를 지정할 수 없기 때문에 대략의 크기를 지정한다고 보면 됨 -(예시) : 메모..
자동으로 입력 커서를 갖다 놓는 속성 autofocus 속성 페이지를 불러오자마자 form에서 원하는 요소에 마우스 포인터를 표시할 수 있음 기본형 : -(예시) 이름 -(결과) 힌트를 표시해 주는 속성 placeholder 속성 사용자가 텍스트를 입력할 때 입력란에 적당한 힌트 내용을 표시해서 그 필드를 클릭하면 내용이 사라지도록 만들 수 있음 이를 사용하면 텍스트 필드 앞에 제목을 사용하지 않고도 사용자에게 해당 필드에 어떤 내용을 입력해야 할지 알려 줄 수 있어서 편리함 -(예시) 전화번호 -(결과) 읽기 전용 필드를 만들어 주는 속성 readonly 속성 사용자가 입력하지는 못하고 읽게만 하는 읽기 전용 필드 텍스트 필드나 텍스트 영역에 내용이 표시되어 있어도 사용자는 그 내용만 볼 수만 있고 입..
폼이란? 사용자가 웹 사이트로 정보를 보낼 수 있는 요소 ex) 로그인 버튼, 회원 가입 등 폼을 만드는 태그 태그 몇 가지 속성을 사용하여 입력받은 자료를 어떤 방식으로 서버로 넘길지, 서버에서 어떤 프로그램을 이용하여 처리할 것인지를 정함 기본형 : 여러 폼 요소 태그의 속성 method : 사용자가 입력한 내용을 서버 쪽 프로그램으로 어떻게 넘겨줄 것인지 정함, method에서 사용할 수 있는 속성값은 get과 post ┌ get : 256 ~ 4096 byte까지 서버로 넘길 수 있음, 주소 표시줄에 사용자가 입력한 내용이 그대로 드러남 └ post : 입력한 내용의 길이에 제한받지 않음, 사용자가 입력한 내용이 드러나지 않음 name : JavaScript로 폼을 제어할 때 사용할 form의 이..
이미지를 삽입하는 태그 태그 웹 문서에 이미지를 삽입할 때 사용 기본형 : 웹 문서 파일과 이미지 파일이 같은 경로에 있다면 src 속성에는 간단히 이미지 파일의 이름만 적으면 됨 alt 속성을 지정하면 이미지를 제대로 표시할 수 없는 경우에 이미지 대신 텍스트가 나타남 width, height 속성으로 이미지의 크기를 조절할 수 있음 % : 현재 웹 브라우저 창의 너비와 높이를 기준으로 이미지 크기를 결정함 px : 이미지의 너비나 높이를 해당 픽셀 크기만큼 표시함 -(예시) 원래 크기의 이미지 width=50%인 이미지2 height=200px인 이미지3 멀티미디어 파일을 삽입하는 태그 태그 HTML 초기 버전부터 사용하여 대부분의 브라우저에서 사용 가능 src 속성을 사용하여 삽입할 멀티미디어 파일..
표를 만드는 태그 태그 표의 시작과 끝을 알려 줌 태그 사이에 표와 관련된 태그를 넣음 태그 표에 제목을 붙임 태그 바로 아랫줄에 사용함 제목은 표의 위쪽 중앙에 표시됨 행과 셀을 만드는 태그 태그 행을 만듦 태그 행 안에 있는 셀을 만듦 태그 표의 제목 행에 셀을 만듦 태그를 사용한 내용은 진하게 표시되고 중앙에 배열됨 -(예시) 표 만들기 예시 예시 1 예시 2 예시 3 A B C 가 나 다 -(결과) 표의 구조를 지정하는 태그 태그 thead는 "table" 과 "head"가 합쳐짐 제목 부분 태그 tbody는 "table" 과 "body"가 합쳐짐 본문 부분 태그 tfoot은 "table" 과 "foot"이 합쳐짐 요약 부분 행이나 열을 합치는 속성 rowspan 속성 행을 합침 colspan 속..
순서 있는 목록을 만드는 태그 태그 ol은 ordered list의 줄임말 기본적으로 숫자 1, 2, 3, · · · 으로 번호를 붙임 type 속성을 사용하여 영문자나 로마 숫자 등으로 순서를 나타낼 수 있음 type = "1" : 숫자(기본값) type = "a" : 영문 소문자 type = "A" : 영문 대문자 type = "i" : 로마 숫자 소문자 type = "I" : 로마 숫자 대문자 start 속성을 사용하여 시작 번호를 바꿀 수 있음 태그 li는 list의 줄임말 목록을 표시할 내용 앞뒤에 태그를 두고, 그 사이에 태그를 삽입함 -(예시) 목록 1 목록 2 이어서 목록 표시하기 목록 3 목록 4 목록 표시 끝! -(결과) 순서 없는 목록을 만드는 태그 태그 ul은 unordered li..