HTML12 HTML5 블록 레벨 요소 / 인라인 요소 블록 레벨 요소 (Block-level) 인라인 요소(Inline) 줄 바꿈 현상 (새로운 줄에서 시작하고, 좌우 양쪽으로 너비 차지) 줄 바꿈 현상 X (새로운 줄을 만들지 않으며 필요한 너비만 차지) 텍스트(문자)와 인라인 요소를 자식 요소로 포함할 수 있다. 때때로 다른 블록 레벨 요소를 자식 요소에 포함할 수 있다. 블록 레벨 요소를 자식 요소에 포함할 수 없다. 1. 블록 레벨 요소 - 블록 레벨 요소의 종류 (기본값이 블록 레벨 요소의 목록) 연락처 정보 필드 집합의 라벨 문서에서 하나 뿐인 중심 콘텐츠 단락 콘텐츠 그림 설명 탐색 링크 포함(내비게이션) 부가 콘텐츠 미디어 콘텐츠 그룹과 설명 순서 있는 목록 긴("블록") 인용구 (들여쓰기) 페이지나 구역의 푸터 문단 상세 정보 위젯 입력 폼.. 2020. 8. 4. HTML5 Tag-[구조 관련 요소] 레이아웃 구성(시맨틱태그) 웹페이지의 레이아웃을 구성하기 위해서 공간을 분할한다. 공간을 분할할 수 있는 태그는 div, span, table 등이 있다. 과거에는 table 태그를 이용하여 레이아웃을 구성하기도 하였으나 반응형 웹이 시작되며 모던 웹에서는 주로 div를 사용하여 레이아웃을 구성한다. 하지만 div 태그는 의미론적으로 어떠한 의미도 가지고 있지 않기 때문에 아래와 같이 시맨틱 태그를 사용하는 것이 더 나은 방법이나 IE에서 작동하지 않기 때문에 주의가 필요하다. tag 의미 및 특징 header 헤더 영역 제목, 내비게이션, 검색 등의 내용을 포함 nav 메인 메뉴나 목차 등을 정의 내비게이션 section 맥락이 같은 요소들을 주제별로 그룹화 article의 그룹화에 많이 쓰임 article 본문의 주내용이 들어.. 2020. 8. 2. HTML5 Tag-div, span [그룹 요소] 1. div (Division) tag 의미 및 특징 div 요소들을 그룹으로 정의하는 태그 (블록 레벨 요소) CSS 적용을 쉽게하기 위해 그룹 설정 (웹사이트의 레이아웃을 만들 때 주로 사용 span 태그 span 태그는각 글자단위로 적용하기가 편리합니다. span 태그 span 태그는각 글자단위로 적용하기가 편리합니다. 2020. 8. 2. HTML5 Tag-[사용자와의 커뮤니케이션을 위한 태그 4] <form> 사용자 입력 속성 속성 설명 placeholder 입력 내용 칸에 힌트 제공 required required 적용 요소에 내용이 비어 있을 경우 경고 메시지 표시 autocomplete 입력 요소에 자동완성 기능 여부 설정 (on/off) pattern 지정한 문자패턴과 입력된 내용의 일치 여부를 판단 multiple 이메일을 ','로 여러개 / 파일 업로드시 동시 선택할 수 있도록 해주는 속성 disabled 요소를 비활성화 상태로 만들어 주는 속성 readonly 입력된 내용을 수정할 수 없도록 만들어 주는 속성 placeholder 필드에 입력형식 힌트주기 아이디 비밀번호 required 필수입력 유효성 검사 주문자 정보 배송지 정보 autocomplete 자동완성 기능 전화번호 이메일 pattern 정규식 속성 휴.. 2020. 8. 1. 이전 1 2 3 다음
