태그 폼의 범위를 지정한다. - action 속성 : 실행 어플리케이션을 지정 - name 속성 : 폼의 이름을 지정 - method 속성 : 클라이언트와 서버 간 데이터를 주고받기 위한 전송방식을 지정 get : 주소창에 데이터가 표시되어 보안이 취약하며, 용량 제한이 있다. 재실행 및 즐겨찾기 가능 (default) post : get방식 보다 안전하며, 용량 제한이 없다. 재실행 및 즐겨찾기 불가능 태그 데이터 입력이나 편집을 위한 컨트롤이 위치하는 곳 종료 태그가 없는 빈 요소 - type 속성 button : 버튼 (푸시 버튼으로 기본 기능이 없다) checkbox : 체크박스 (선택/해제 가능한 체크박스로 중복 선택 가능) radio : 라디오 버튼 (여러항목 중 한가지만 선택가능하다) ran..

태그 영상파일을 삽입하는 요소 브라우저가 모든 비디오 파일 형식을 지원하는 것은 아니므로 표준 형식의 비디오 파일을 사용해야 한다. - poster 속성 : 비디오의 썸네일 이미지를 지정한다. (이 속성을 지정하지 않으면 비디오 파일의 첫 번째 프레임을 이미지로 보여준다) - width 속성 : 비디오의 가로사이즈 지정 - height 속성 : 비디오의 세로 사이즈 지정 - muted 속성 : 음소거 설정 - loop 속성 : 반복 재생 설정 - controls 속성 : 비디오의 제어 컨트롤을 표시 - preload 속성 : 비디오 파일의 사전 로딩을 지정 auto : 문서 로딩과 동시에 비디오 파일을 로딩시킬 때 metadata : 문서 로딩 시 메타데이터만 로딩 none : 문서 로딩 시 비디오 파일..

태그 문서에 이미지를 삽입하는 요소 종료 태그가 없는 빈 요소 - src 속성 : 이미지 소스를 지정하는 속성으로 소스파일의 위치를 URL형식으로 입력한다. (절대경로 or 상대경로) - alt 속성 : 이미지의 대체 텍스트를 지정한다. (사용자가 이미지를 볼 수 없는 경우 대체 텍스트로 표시되므로 입력 권장) - width 속성 : 이미지의 가로 사이즈 지정 - height 속성 : 이미지의 세로 사이즈 지정 - usemap 속성 : 요소와 연결할 이미지맵을 지정한다. (#맵이름) (좌) 이미지가 제대로 표시된 경우 / (우) 이미지를 불러올 수 없어 대체 텍스트로 표시된 경우 태그 이미지맵 요소로 이미지 위의 도면 역할을 한다. 요소와 요소를 연결시키는 요소 - name 속성 : 요소의 이름을 지정하..

태그 앵커(anchor,닻) 요소 다른 문서로 연결하거나 같은 문서 내의 다른 지점으로 연결하는 용도로 사용된다. 요소의 컨텐츠는 링크 목적지에 대한 설명을 입력한다. (링크텍스트) 파란색 글자에 밑줄이 기본 스타일이며, 이미 한번 방문했던 링크텍스트는 보라색으로 표시된다. - href 속성 : 링크의 목적지를 지정하는 속성으로 요소가 하이퍼링크 기능을 수행하기 위해 반드시 필요하다 절대 경로 : 전체 웹 주소 "http://www.example.com" 상대 경로 : 로컬 경로 "example.html" (같은 폴더에 있는 파일은 파일명을 입력, 같은 폴더에 있는 다른 폴더의 위치는 "폴더명/파일명" 입력, 상위 폴더는 "../"로 표현) 같은 문서의 다른 지점 : id값 "#example" 빈 링크 ..

태그 표의 시작과 끝을 표시 - border 속성 : 표의 테두리 두께 지정 태그 표의 제목을 표현 태그 행의 시작과 끝을 표시 태그, 태그 요소는 표의 헤더 셀을 표현한다. 요소는 표의 데이터 셀을 표시한다. - colspan 속성 : 가로 셀 병합 - rowspan 속성 : 세로 셀 병합 태그, 태그, 태그 테이블을 그룹핑할 때 사용한다. 레이아웃에 영향을 주지 않는다. 용돈기입장 1월 2월 구매물품 금액 구매물품 금액 과자 1,500원 커피 2,500원 공책 1,000원 사탕 1,000원 합계 2,500원 합계 3,500원

태그 강조를 표시 문맥을 통한 의미 변화가 있을 때만 사용 이탤릭체로 표현 태그 높은 중요도를 표시 중요한 내용 강조할 때만 사용 볼드체로 표현 태그 약어 또는 두문자어를 표시 - title 속성 : 마우스 오버 시 툴팁에 표현할 내용을 지정 UX 사용자 경험은 사용자가 어떤 시스템, 제품, 서비스를 직·간접적으로 이용하면서 느끼고 생각하게 되는 지각과 반응, 행동 등 총체적 경험을 말한다. 태그 특별한 의미가 없이 단순히 글자를 이탤릭체로 표현하는 것 태그 특별한 의미가 없이 단순히 글자를 볼드체로 표현하는 것 이탤릭체 볼드체 태그 저작자 또는 문서에 관한 연락처 정보를 표시할 때 사용 이탤릭체로 표현 문의 : 010-1234-5678 태그 텍스트 방향을 임의로 바꿀 때 사용 - dir 속성 : 텍스트..

태그 인라인 요소 (inline element) 콘텐츠와 다른 인라인 요소만 포함할 수 있다. 새로운 행에서 시작할 수 없다. 텍스트레벨요소(text-level element)이다. 넓이에 대한 개념이 없어서 그 값을 지정해도 적용이 불가능하다. 신축성 태그로 콘텐츠 크기에 따라 영역의 크기가 바뀐다. 작은 구조를 만들기 위한 요소이다. - style 속성 backgraound-color : 배경색 지정 (색상이름 or 색상코드) span1 span2span2 span3span3span3 태그 블록레벨 요소 (block-level element) 인라인 요소와 다른 블록 요소를 포함할 수 있다. 새로운 행에서 시작한다. 넓이나 높이 속성값 적용이 가능하다. 넓이를 지정하지 않으면 화면의 100%로 적용된..

태그 순서가 없는 리스트를 표현 요소로 리스트 항목을 정의 하나 둘 셋 넷 다섯 태그 순서가 있는 리스트를 표현 요소로 리스트 항목을 정의 - type 속성 : 리스트 스타일을 지정 1 : 숫자 (default) a 또는 A : 알파벳 i 또는 I : 로마숫자 - start 속성 : 리스트의 시작 숫자를 지정 (숫자만 가능) - reversed 속성 : 리스트를 역순으로 지정 하나 둘 셋 넷 다섯

태그 문단의 제목을 표현 ~ 까지 가능하며 숫자가 작을수록 상위 제목이므로 크기가 커진다. 가장 상위 제목인 요소는 페이지당 1개만 사용하는 것이 바람직하다. 중요한 제목부터 숫자 순서대로 쓰는 것이 원칙이다. 글자 크기와 굵기 때문에 제목 태그를 사용하지 말아야 한다. 제목1 제목2 제목3 제목4 제목5 제목6 태그 하나의 문단을 표현 (paragraph) 추가 여백과 줄 바꿈을 자동으로 제거한다. 안녕하세요. 공부하는 블로그입니다. 태그 개행 태그로 해당 부분에서 다음 행으로 바꿔준다. 종료 태그가 없는 빈 요소 안녕하세요. 공부하는 블로그입니다. 태그 미리 서식을 지정한 텍스트를 정의 요소와 달리 추가 여백과 줄 바꿈을 유지하며, 코드에 작성된 그대로 표현한다. 안녕하세요. 공부하는 블로그입니다. ..