태그의 구분

블록 레벨 요소

자기가 속한 영역의 너비를 모두 차지

인라인 요소

자기에게 필요한 만큼의 공간만 차지

strong 태그

감싸는 콘텐츠를 굵게 표시

em 태그

감싸는 콘텐츠를 기울여 표시

mark 태그

감싸는 콘텐츠 형광펜 표시

블록 형성



필요한 공간만 차지하는 걸 볼 수 있다.

이미지 표시하기

img 태그

이미지를 표시할 때 쓰는 태그, 단일 태그이므로 닫는 태그가 필요없다.
표시할 이미지에 대한 정보를 속성으로 지정

형태

<img src = " 표시할 이미지 파일" alt = "이미지설명"/>

scr 속성

이미지 위치정보와 파일명 입력 받는 속성
서버에 위치한 이미지 파일 혹은 내 컴퓨터에 저장된 이미지 파일

alt 속성

이미지 설
이미지 로딩 전이나 로딩 실패한 경우 이미지 대신 텍스트가 표시되는 대체 텍스트 역할
ex) 음성인식기

이미지 크기 조절하기

너비, 높이 단위 없이 정수 값으로 지정 가능(픽셀/px로 적용)
지정하지 않을 경우 원본 크기로 표시된다.

width

너비를 입력 받는 속성

height

높이를 입력 받는 속성

형태

<img src = "표시할이미지파일" alt = "이미지설명" width = "너비값" height = "높이값"/>

사진 파일명을 변경하고 속성을 넣어봤다.


원본 크기가 너무 커서 크기도 조정해본다.

이미지가 유실될 때 사용될 텍스트 대치