HTML 기본 태그설명

Block - div, h, p, ul, ui…

• 가로사이즈(width) 100%를 항상 차지함
• 높이는 내부 컨텐츠의 크기에 따라 자동 지정됨
• 한 줄에 하나의 블록 요소만 위치할 수 있음 -> 한줄 내리기 가능, 개체를 추가할 때 마다 아래로 내려감
• 스타일 제약 없음 , 사이즈 여백 조절 가능
• 내부 자손으로 block, inline 속성의 태그를 가질 수 있다 걍 자유롭게 보쌈 쌉가능
• h1, p 태그는 내부 자손으로 inline 속성만 가질 수 있다

Inline - a, img, span, b, i, mark…

• 콘텐츠 크기만큼 영역이 설정됨
• 한줄 내리기 안 됨
• 스타일에 제약이 있음, 사이즈 여백 조절 불가능
• 보통 텍스트 작성시에 사용, 수평으로 정렬 됨

! block 태그 안에서 inline 태그 사용

• a : 링크를 거는 태그, 안에 인라인 넣어도 된다. 안에 a 태그 다시넣으면 작동 안됨
  tagret = blank : 새 탭으로 열기
• i : 기울기태그
• span : 인라인을 묶는 태그
• b : 볼드체태그
• mark : 텍스트를 강조할 때에 사용함, 형광팬으로 친 것 같은 효과가 난다
• fieldset : 폼 그룹 묶기, 테두리 지정됨
• legend : 테두리 안에 소제목 지정
• form : 폼, 항상 변경마다 Submit 이 일어남, 이 태그에는 스타일 명령 내리기 자제할 것
• label : 폼 요소에 레이블

컨텐츠 묶기 :

• header : 로고 검색 멤버 메뉴 상단바
• main : 페이지 콘텐츠들
• aside : 사이드 배너 or 메뉴
• footer : 카피라이트 회사주소 하단바
• article : h2 태그와 컨텐츠를 묶어 사용하는데 최적의 태그

미디어 :

• figure : 사진을 묶을때 쓰는 태그 안에 사용하여 설명 작성 가능
• figcaption : 피규어 태그 안에 글자를 쓸 때에 이걸 쓴다.
• iframe : 브라우저 안에 다른 브라우저 컨텐츠를 만듦
  scrolling="no" 스크롤 잠금
• video controls autoplay muted src="../@" tyle="video/mp4" poster="../@"
  : 비디오 형식 재생바 보이고 자동재생에 소리없음, 타입지정, 썸네일