[Html] 이미지 태그/scr/alt /외부 이미지 파일의 접근 경로

이미지 태그 : 이미지를 삽입할 때 사용

참조

 body 태그 안에서 쓰인다.

 

image 파일종류

	jpg	png	gif	bmp	tiff	tga
용량(작은순서)	1	3	2	6	4	5
압축율	1			x

 

bmp : 압축을 할 수가 없고, 투명처리(sprite)를 직접 해주어야 하는 번거로움 때문에 잘 사용하지 않는다.
png : 투명처리가 들어가 있다.

 

 

img 속성 & 속성 값

 scr : 이미지의 경로 지정

 alt : 이미지가 없을 때 나오는 문구

 width : 이미지의 너비 지정

 height : 이미지의 높이 지정

 placehold.it : 이미지가 없을 때 이미지의 크기에 맞는 더미 이미지를 제공해줌

 

참조 

 이미지 크기 지정 시 width, height 둘 중 하나만 사용하면 원본 비율이 유지된다.

 

 

예시

<img alt="이미지 없음" src="./image/bird.png" width="240"><br>
<img alt="이미지 없음" src="d:\\image\\bird.png"> <br>
<img alt="이미지 없음" src="pic.jpg"> <br>

 

실행화면

 

 

 

 

이미지 파일의 접근 경로

 

이미지 파일은 단순히 컴퓨터 내 저장되어 있다고 생각하면 안 되고,

서버 내에 있다고 해야 한다.

이미지 파일은 절대 경로로 지정할 수 없다.

 

 

 

 

 

 

 

 

 

 

 

 

 

외부 이미지 파일의 접근 경로

 

예시 : 외부 이미지 파일의 경로의 시작은 이미지가 있던 홈페이지 주소 값으로 시작된다.

<img alt="" src="이미지가 있던 홈페이지 주소
          /wp-content/uploads/2015/09/googles-new-logo-03.png" width="240"><br>

 

실행결과