이미지
Coddy HTML 여정의 기초 섹션에 포함된 레슨. 60개 중 23번째.
이미지는 웹페이지를 더욱 흥미롭게 만들 수 있으며, HTML에서 <img> 태그를 사용하면 간단히 추가할 수 있습니다. <img> 태그는 자체 닫힘 태그이므로 닫는 태그가 필요하지 않습니다.
이미지를 표시하려면 src 속성을 사용해야 합니다. 이 속성은 이미지의 위치(URL 또는 파일 경로)를 지정합니다. 예를 들면 다음과 같습니다.
<img src="https://coddy.tech/images/bit.svg" />이 예제에서 브라우저는 URL https://coddy.tech/images/bit.svg에서 이미지를 불러와 표시합니다.
자체 닫힘 태그는 <img>처럼 내부에 콘텐츠가 없는 요소에 사용되므로 닫는 태그가 없습니다. HTML5에서는 끝의 슬래시가 선택 사항입니다. <img src="bit.svg">와 <img src="bit.svg" />는 둘 다 유효합니다. 이 과정에서는 />를 사용합니다.
챌린지
쉬움HTML 문서에 이미지를 추가하세요. 수업의 예제에 나온 URL이나 다른 URL을 사용할 수 있습니다.
이미지가 표시되는지 확인하세요!
직접 해보기
<!DOCTYPE html>
<html>
<body>
<!-- 여기에 코드를 작성하세요 -->
</body>
</html>
실력 점검이 레슨에는 짧은 퀴즈가 포함되어 있습니다. 레슨을 시작해 문제를 풀고 진행 상황을 기록하세요.
기초의 모든 레슨
직접 연습해 보세요: Web 플레이그라운드