html 이미지 넣기와 크기조절 방법html 이미지 넣기와 크기조절 방법
Posted at 2015. 1. 12. 23:37 | Posted in HTML 배우기반응형
html에서 폰트와 이미지는 가장 기본적인 요소죠.
그렇기 때문에 더욱 충실하게 알아두어야 할 것입니다.
기초가 탄탄해야 나중에 더욱 어려운 부분에서
이를 바탕으로 응용이 가능하겠죠.
그다지 어렵지는 않지만,
간단하게 워밍업하는 셈치고 한번 포스팅해 보도록 하겠습니다.
1. html로 이미지 넣기
<img src="이미지 경로">
위의 태그만 넣어주면 바로 사진 넣기가 가능합니다.
여기서 한가지 짚고 넘어가야 할 부분이 있습니다.
그것은 바로 이미지의 경로를 설정하는 방법입니다.
일단 컴퓨터 내에 이미지가 있을 경우에는
폴더 경로/이미지.jpg
의 방법으로 이미지가 있는 경로를 지정해주면 되겠죠.
경로를 알기가 어렵다고 여겨지면,
사진을 오른쪽 마우스로 클릭하여 위의 그림과 같이 속성을 볼 수 있습니다.
여기서 빨간 사각형으로 마크한 부분이 바로 경로입니다.
웹상에 있는 이미지의 경로는
위의 그림속성보기의 방법으로 확인이 가능합니다.
2. html로 이미지 크기조절하기
<img src="사진 경로" width="400" height="600">
사진 크기를 조절하는 것은
width : 가로폭, height : 세로폭을 지정해주면 됩니다.
원래의 사진크기를 그대로 하는 것이 가장 자연스럽겝지만,
포토샵 작업없이도 간단하게 태그로서
위와 같은 방법으로 조절이 가능합니다.
반응형
'HTML 배우기' 카테고리의 다른 글
HTML로 동영상 삽입, 유튜브 동영상 링크 삽입하기 (6) | 2015.01.15 |
---|---|
HTML 그림링크삽입, 새창띄우기 방법 (0) | 2015.01.13 |
html 글씨체, 밑줄 긋기 방법 (0) | 2015.01.12 |
html 폰트 색상, 사이즈 변경하기 (0) | 2015.01.12 |
HTML 이미지, 글씨 가운데 정렬방법 (0) | 2015.01.10 |