반응형
웹에 이미지를 추가하려면 어떻게 해야 할까?
간단하다.
<img> 태그를 사용해주면 된다.
(img = image)
바로 코드를 작성하자.
<html>
<head>
<title>Google Image</title>
</head>
<body>
<h1>GOOGLE</h1>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/2/2f/Google_2015_logo.svg/1200px-Google_2015_logo.svg.png">
</body>
</html>실행시켜 보자.
어떻게 이미지가 들어가기는 했는데, 크기가 너무 크다.
width와 height를 사용해 크기를 맞춰 보자.
코드 수정!
<html>
<head>
<title>Google Image</title>
</head>
<body>
<h1>GOOGLE</h1>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/2/2f/Google_2015_logo.svg/1200px-Google_2015_logo.svg.png" width=500 height=500>
</body>
</html>실행시켜 보자.
크기가 작아졌다.
화면 비율도 맞추면 완벽할 것이다.
화면 비율은 여러분이 알아서 원하는 사진으로 맞춰 보시길!
반응형
'웹개발 > HTML Tags' 카테고리의 다른 글
| [Html Tags] 다른 페이지로 링킹(linking)하기 | <a> (0) | 2021.01.30 |
|---|---|
| [Html Tags] 리스트 정렬하기 | <ul>, <li>, <ol> (0) | 2021.01.30 |
| [Html Tags] 글자에 기울임 효과 주기 | <em> (0) | 2021.01.30 |
| [Html Tags] 문단 쓰기 | <p> (0) | 2021.01.30 |