HTML img태그&경로지정법 ,(URL,URI,URN)

hyo·2021년 10월 10일
0

HTML &  CSS

목록 보기
6/16

-img태그 기본 사용방법-


img태그는 이와같이 <img> , <img /> 두가지로 다 써도된다.

img태그안에 속성으로 alt='속성값'은 웹 페이지가 어떠한 이미지를 가지고있는지 출력하거나 이미지가 없거나 경로가 잘못되어 안나올때,
화면에 출력되는값을 쓸수있다.

img태그 안에 크기 속성을 넣을수도있는데, 지금은 style이나 css를 주로 사용하기에 잘쓰지않는다.


img태그안에 src(source)속성에 입력하는것은 기본적으로 URL 또는 URI 라고 부르게되는데,
URI : Uniform Resource Identifier(식별자)
-> (그것)을 부르는 방법
URL : Uniform Resource Locator(위치)
-> 어디어디에있는 그것 나와.
URN : Uniform Resource Name(이름)
-> 그것 나와!

URIURL,URN을 다 포함한다고 보면된다.


경로지정법

  1. 절대 경로 - 내가 어디에 있건 정확한 주소로 찾아들어가게 된다.
    -> 경기도 OO시 OO동 OO아파트 OO동 OO호
    [예] http://placehold.it/200x200
  2. 상대 경로 - 내가 있는 위치로부터 목표물까지 특정폴더에서 뭔가를 타고 들어가는것처럼
    ->우리집 위 ->우리집 아래 -> 우리집 아래에서 오른쪽으로 가서 첫번째방에있는 책상위에있는 가방
    [예X]http://abcd.com/
    [예X]//abcd.com/
    [예] /test/folder/bag.jpg

-상대 경로 지정 법

/ : 루트
. : 현재 위치[생략가능]
.. : 위의 위치

lecture.html과 같은 위치의 a.jpeg와 folder이기 때문에 a.jpeg를 ./a.jpeg , a.jpeg 로 현재위치를 생략하고 쓸수도있다.



lecture.html과 같은위치의 folder와 그 안에 있는 b.jpeg를 출력해보았다.
현재위치 ./folder/b.jpeg 또는 현재위치 생략하고 folder/b.jpeg로 쓸수있다.


.. 를 쓰기위해 lecture.html을 folder폴더로 옮겨놓고 써보았다.

일단 lecture.html과 같은위치에 있는 것은 b.jpeg이다.


이렇게 ..은 그위의 위치를 지정해준다.

profile
개발 재밌다

0개의 댓글