요소/전역속성

텍스트요소

구조를 나타내는 요소

 1) 컨테이너

•   div (블록)
•   span (인라인)

 2) 시멘틱웹(Semantic Web)

•   요소의 의미를 고려하여 구조를 설계하고 코드를 작성
•   검색엔진은 의미론적 마크업을 분석하여 페이지의 검색 랭킹에 영향을 줄 수 있는 중요한 키워드로 간주
•   의미없는 div만 사용하는것보다 nav, article, aside 등 의미있는 요소 사용

 3) header, footer

 4) nav

 5) aside

 6) main

 7) article

 8) section

 목록과 표

•  ul, ol, li
•  dl, dt, dd
•  table, tr, th, td
• thead, tbody, tfoot
• caption

임베디드 요소

• img - src, alt, width, height
• 브라우저 지원여부 검색 사이트 can I use ..
• 반응형 이미지 - srcset, sizes
• video
• audio
• canvas, iframe

폼 관련 요소-속성

• form - action, method속성
• method- GET, POST
• label, input
• name과 달리 id는 한문서내에서 겹치면 안됨
• fieldset, legend(범례)
• input - type, placeholder, autocomplete, required
• input - disabled, readonly
• input - step, min, max
• button
• input과 달리 button은 자식요소를 가질수 있음
• select, option, optgroup
• input - list, datalist
• textarea

메타데이터 요소

• title
• meta-문서정보, 문자인코딩, 뷰포트
• link
• MIME 타입
• style
• script : javascript넣을 일이 있을때, body의 마지막에 쓰는것을 권장

전역속성

• id:고유 식별자, 공백불가
• class: 중복가능, 공백으로 여러개 동시에 요소에 적용 가능
• style
• title
• lang
• data-로 시작하는 속성
• draggable
• hidden