html 이미지 넣기와 크기조절 방법

 

 

html에서 폰트와 이미지는 가장 기본적인 요소죠.

그렇기 때문에 더욱 충실하게 알아두어야 할 것입니다.

 

기초가 탄탄해야 나중에 더욱 어려운 부분에서

이를 바탕으로 응용이 가능하겠죠.

 

그다지 어렵지는 않지만,

간단하게 워밍업하는 셈치고 한번 포스팅해 보도록 하겠습니다.

 

1. html로 이미지 넣기

 

 <img src="이미지 경로"> 

 

위의 태그만 넣어주면 바로 사진 넣기가 가능합니다.

 

여기서 한가지 짚고 넘어가야 할 부분이 있습니다.

그것은 바로 이미지의 경로를 설정하는 방법입니다.

 

일단 컴퓨터 내에 이미지가 있을 경우에는

폴더 경로/이미지.jpg

의 방법으로 이미지가 있는 경로를 지정해주면 되겠죠.

 

 

경로를 알기가 어렵다고 여겨지면,

사진을 오른쪽 마우스로 클릭하여 위의 그림과 같이 속성을 볼 수 있습니다.

여기서 빨간 사각형으로 마크한 부분이 바로 경로입니다.

 

웹상에 있는 이미지의 경로는

위의 그림속성보기의 방법으로 확인이 가능합니다.

 

2. html로 이미지 크기조절하기

 

<img src="사진 경로" width="400" height="600">

 

사진 크기를 조절하는 것은

width : 가로폭, height : 세로폭을 지정해주면 됩니다.

 

원래의 사진크기를 그대로 하는 것이 가장 자연스럽겝지만,

포토샵 작업없이도 간단하게 태그로서

위와 같은 방법으로 조절이 가능합니다.