[Front-End] HTML 배우기 (2)

 ① 이미지: <img>태그로 웹 페이지에 이미지를 추가할 수 있음.

<img>태그 안에는 src속성을 설정해주어야 하며, 이것은 이미지의 원천, 위치 또는 URL 이어야 한다.

ex) <img>태그는 자동으로 닫히는 태그이므로 닫는 태그를 해주지 않는다.

<img src="image's location.jpg" />

 

② 이미지 대체 글: <img>태그 안에 alt속성을 사용하여 텍스트를 대체하는 이미지에 대한 설명을 작성할 수 있음.

만약 의미 있는 정보가 아닐 경우 alt속성을 비워둘 수 있다.

ex) <img>태그 안에 alt속성을 사용할 수 있다.

<img src="image's location.jpg" alt="This is the image's explanation"/>

 

③ 비디오: <video>태그로 웹 페이지에 비디오를 추가할 수 있음.

<video>태그 안에는 src속성을 설정해주어야 하며, 이것은 비디오의 링크여야 한다.

ex) <video>태그는 <img>태그와 달리 열기와 닫기 태그가 모두 필요하다. width와 height속성으로 크기를 지정해줄 수 있으며, controls를 적어주어야 비디오를 멈추고 재생하고 스킵할 수가 있다. 여는 태그와 닫는 태그 사이에 글은 브라우저가 비디오를 불러올 수 없을 때에 나타나는 텍스트이다.

<video src="video.mp4" width="100" height="100" controls>
  Video can not be supported.
</video>