본문 바로가기
Cording/HTML & CSS

[HTML / CSS] 링크 / 이미지 삽입

by €€£¥ 2019. 12. 18.

 

하이퍼링크(Anchor) -> <a> 태그

<a href="https://google.com" target="_blank">구글로 가는 링크</a>

target="_blank" -> 새창에서 보기 (설정 없으면 현재 창에서 이동)

 

폴더 내 페이지 이동 -> 상대경로 사용

/* 하위폴더 가는법 */
<a href="folder1/xxx.html">xxx</a>

/* 상위폴더 가는법 */
<a href="../xxx.html"></a>

 

 

이미지 삽입  -> <img> 태그

<img src="이미지파일 주소" width="가로크기" height="세로길이">

이미지파일 경로

  - 서버 내에서는 상대경로 사용

  - 웹에서 끌어올 경우 인터넷 주소 사용

 

이미지 크기

 - width : 가로 크기

 - height : 세로 크기

 - 가로, 세로 중 한 쪽만 설정 시 비율대로 표시

 - 크기 단위는 px 단위 / % 단위 (화면비율) 사용 가능

 

이미지 가운데 정렬 CSS 태그

<style>
img{
	display: block;
    margin-left: auto;
    margin-right: auto;
    }
</style>

댓글