[HTML5] 폼 <form> 태그 등 사용법 정리

폼(form) 이란? 폼이란, 사용자가 뭔가를 입력하는 형태의 것을 말한다. 로그인창에서 아이디와 비밀번호를 입력하는 박스가 이에 해당된다. 로그인 폼을 예시로 폼의 작동 방식에 대해 설명해 보겠다. 사용자가 아이디와 비밀번호를 입력하고 '로그인' 버튼을 누르면 입력한 내용이 웹 서버로 보내진다. 서버에서는 데이터베이스를 뒤져서 사용자가 보낸 아이디와 비밀번호가 서로 일치하는지 확인하고 그 결과를 브라우저로 보낸다. 이처럼 폼과 관련된 대부분의 작업은 데이터베이스를 기반으로 한다. 텍스트 박스나 버튼과 같은 폼의 형태는 HTML 태그를 이용하고, 그 폼에 입력된 사용자 정보를 처리하는 것은 PHP, ASP, JSP 같은 서버 프로그래밍을 이용한다. 폼 만들기 - 태그 폼 요소들 태그와 태그 사이에 여러 ..

• format_list_bulleted HTML5
• · 2023. 8. 22.
• textsms

[HTML5] 이미지와 하이퍼링크 삽입하기

이미지 삽입 하는 태그 이미지를 삽입하는 방법은 태그를 이용하는 것이다. 웹 문서에 있는 이미지를 삽입하려면 위의 '경로'에 웹 링크를 넣어주면 된다. 이미지 속성 변경 1. alt 속성 화면 낭독기에서 읽어주는 이미지 대체 텍스트를 삽입한다. 2. width 속성, height 속성 이미지의 크기를 조정해준다. 이미지 설명 글 붙이기 태그 안에 설명 글을 붙일 대상을 넣고 태그 사이에 설명 글을 적는다. 이미지 설명 글 하이퍼링크 삽입하는 태그 링크를 삽입하기 위해서는 태그를 사용한다. 태그 안에는 아래의 속성들을 사용할 수 있다. 속성 설명 href 링크한 문서나 사이트의 주소를 입력 target 링크한 내용이 표시될 위치를 지정 download 링크한 내용을 다운로드 rel 현재 문서와 링크한 문서..

• format_list_bulleted HTML5
• · 2023. 7. 23.
• textsms

[HTML5] 태그를 이용해 표 만들기

기본적인 표 만들기 우선 기본적인 표를 만드는 태그는 아래와 같다. 1. 태그: 표 자리를 만든다. 2. 태그: 행을 만든다. 3. 태그: 각 행마다 셀을 만든다. 4. 태그: 셀에 표의 제목을 만든다. (해당 셀에 들어가는 내용은 셀의 중앙에 배치되고 굵은 글씨로 표시된다.) (기본형) 제목1 내용1 내용2 제목2 내용3 내용4 (결과물) 셀 합치기 (행 또는 열 합치기) rowspan 속성과 colspan 속성을 태그나 태그 안에 사용하면 원하는 개수의 셀만큼 합칠 수 있다. (기본형) 내용 내용 표의 제목 붙이기 표의 제목을 붙이는 태그로는 태그와 태그가 있다. 먼저 태그를 사용하면 표의 위쪽 중앙에 표의 제목이 표시되고, 태그는 태그 바로 다음에 사용해야 한다. 태그 안에는 다른 태그를 사용해서 ..

• format_list_bulleted HTML5
• · 2023. 7. 15.
• textsms

[HTML5] 태그로 목록 만들기

순서가 있는 목록 만들기 1. ~~~~~ 2. ~~~~~ 3. ~~~~~ 처럼 순서가 필요한 목록을 만들 때는 태그를 사용한다. (ordered list) 아래와 같이 태그 안에 태그 (list item)를 사용해 각 항목에 번호를 부여한다. (기본형) 내용 내용 내용 ... 여기서 태그를 이용해 여러 항목을 나열할 때, 태그를 닫아주는 태그는 없어도 괜찮다. 그리고 태그 안에 속성을 넣어 속성 값에 따라 조금씩 다른 형태로 표시할 수 있다. 1) type 속성 속성 값 설명 1 숫자 (기본 값) a 영문 소문자 A 영문 대문자 i 로마 숫자 소문자 I 로마 숫자 대문자 ※ 태그의 속성은 CSS의 list-style-type을 이용해서 설정할 수도 있다. 2) start 속성 순서 목록의 index는 기..

• format_list_bulleted HTML5
• · 2023. 7. 14.
• textsms