개발자로 살아가기

background-image

토픽 개발자로 살아가기 > CSS > CSS Dictionary

Summary

배경이미지를 지정합니다.

<uri> | none | inherit
기본값 none
적용대상 모든요소
상속 상속안됨
퍼센테이지 지정불가
미디어 Visual

Value

  • uri : 배경 이미지로 지정할 이미지의 주소를 나타냅니다.
  • none : 배경 이미지를 지정하지 않습니다.

Tip

  1. 배경이미지를 지정하지 않았거나 배경이미지의 투명한 부분은 background-color에서 지정한 색상이 보여집니다.
  2. 다음과 같이 사용할 수 있습니다.
    body {
        background-image: url("image/bg.gif");    
    }

댓글

댓글 본문
  1. Sansol Park
    배경이미지가 뜨지 않으면 먼저 이미지 파일의 확장자가 제대로 되어 있는지 확인해보시고, 파일의 위치가 정확한지 확인해보는 것이 좋습니다. 필요하다면 상대경로 방식과 절대경로 방식을 모두 시도해보시길 바랍니다.

    by OpenAi를 사용한 답변입니다.

    openai 한테 한번 질문을 남기고 답을 받아보았습니다. 제 생각에도 파일의 위치와 경로가 정확한지 확인하는게 첫번째 같아요.
    대화보기
    • yeonyeon
      폴더명 없이 body{background-image: url("사진명.gif");} 했는데도 뜨지 않습니다ㅠ
    • yeonyeon
      body{background-image: url("사진폴더주소/사진명.gif");} 했는데 안뜨는데 뭐가 잘못된걸까요..
    • 푸른하늘
      11일차 공부 감사합니다
    • GoldenEgg
      앗 uri가 오타가 아니었군요... 위에서 부터 내려오느라 계속 지적했는데 ㅠ 미안합니다..

      그래도 포괄적인 url을 사용하는게 낫지 않을까 란 생각도 듭니다.
    • 리체:leezche
      참고로 URL은 URI의 한 형태로....
      uri는 웹 상에 존재하는 자원을 식별하기 위한 것이고(패스라고 생각하면 쉬울것 같습니다),
      url은 uri에다가 http프로토콜, 호스트명등을 포함한 웹페이지 주소라고 할 수 있습니다.
    • 리체:leezche
      제가 영혼없이 uri를 url로 수정했는데...
      생각해보니 더 정확한 표현은 uri 같습니다.
      수정된 부분 다시 원복 할께요...
      관련 페이지 링크 : http://www.w3.org......age
    • 수정부탁합니다.
      <값> 의 <uri> 를 <url>로 해야할 것 같습니다.
    • 리체:leezche
      감사합니다. 오타 수정되었습니다.
      대화보기
      • onasaju
        uri : 배경 이미지로 지정할 이미지의 주소를 나타냅니다.

        위 부분을

        url 로 변경해야 될 것 같습니다.