이미지관련태그

2024. 5. 17. 17:15HTML

이미지 태그 img

 

- 웹 문서에 사진이나 그림같은 이미지를 삽입하는 용도의 태그

- 태그 작성시 유의사항 : 

        1. src : 삽입할 이미지의 경로를 작성하는 속성
                 파일 위치, 인터넷 주소 등 이미지를 가져올 수 있는 경로
        2. width : 가로 길이 지정해주는 속성
        3. height : 세로 길이 지정해주는 속성
        4. alt : 이미지 설명하는 작성하는 속성 
                 이미지가 보이지가 않을 때 화면에 출력되는 그림
                 시각 장애인 등 사회적 약자들에게 이미지 설명을 읽어주는 역할

        * width, height, alt는 필수요소가 아님.

 

!주의사항!

        - http로 시작하지 않는 이미지는 주소를 가져올 수 없음 
        - http로 시작하는 이미지는 보임

이미지 크기를 조정할 때 :

width 가로 길이를 설정해주는데 보통 px이나 %를 많이 씀

height 세로 길이를 설정해주는데 보통 px이나 %를 많이 씀

 

주소로 이미지 찾은 결과

 

 

절대 경로 : 변하지않는 기준점으로부터 목표까지의 경로

 

 

 

상대 경로 : 현재 파일or페이지 위치를 기준으로 해서
목표까지의 경로를 나타낸 것
(파일 기준에서부터 시작하는 위치)
코드에서 뒤로가기를 작성할 때는 "../"를 이용해서 뒤로가기를 진행한다

뒤로가기를 세 번 하고 싶다면 ../../../

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

'HTML' 카테고리의 다른 글

비디오관련태그  (0) 2024.05.17
스타일  (0) 2024.05.17
표 관련 태그  (0) 2024.05.17
글자+목록 실습  (0) 2024.05.17
목록관련태그  (0) 2024.05.17