어제 이미지 링크거는 방법에 대해서 배우셨죠?

<img src="http://www.i-boss.co.kr/new/newimg/img/logo.gif">

이제 이미지에 사이즈를 줘볼까요?

사이즈는 가로 사이즈와 세로 사이즈로 구분됩니다.
가로는 영어로 뭐죠? width, 세로는? height

html에서 사이즈를 결정하는 단위는? 픽셀(pixel)로서 숫자만 기입하면 됩니다.

그럼 위의 이미지에 사이즈를 한번 줘볼까요?

<img src="http://www.i-boss.co.kr/new/newimg/img/logo.gif" width="200" height="200">

가로 사이즈를 200 픽셀주고, 세로도 200 픽셀 주었습니다.


아래 초보자 연습실에서 마음껏 한번 해보세요. 사이즈도 바꿔가면서... ^^
http://www.i-boss.co.kr/new/?doc=bbs/gnuboard.php&bo_table=novi009

그런데 해보시면... 200 사이즈의 경우.. 그림이 흐릿하게 변하는 걸 확인하실 수 있을 거에요.

그 이유는 뭘까요?

그건.. 원본 이미지가 작아서 그렇습니다.
원본 이미지 자체는 작은데 이걸 억지로 늘리니 그림이 흐릿해지는 거죠.


그리고.. 만약 이렇게 사이즈를 주지 않으면 원본 이미지의 크기 그대로를 불러오게 됩니다.
보통은 이렇게 원본 이미지를 그대로 불러오는 경우가 많습니다.
그래야 이미지가 깨지지 않고 자연스럽게 나오니깐요.

하지만 특별히 큰 사이즈를 좀 줄여야 하거나 할 때에는 이렇게 사이즈를 부여하시면 됩니다.