CSS

배경(background)

소개

CSS를 이용하면 엘리먼트의 배경을 지정할 수 있습니다. 여기서는 배경과 관련된 중요속성들을 알아봅니다. 

  • background-color : red
  • background-image : url("bg.png")
  • background-repeat : repeat, no-repeat, repeat-x, repeat-y
  • background-attachment : scroll, fixed
  • background-position : left top  or x% y% or x y
  • background-size : 100px 100px or cover or contain

참고

w3schools.com

 

댓글

댓글 본문
작성자
비밀번호
  1. sunday00
    현재 만들고 있는 html과 같은 폴더에 있으면 되고, 되도록 파일 이름을 영문으로 해보세요.
    확장자와 파일명이 맞는지도 체크해 보세요.
    대화보기
    • 머리에 속속 들어오게 가르치시네요. 땡큐
    • 오들오들오드리
      그림을 다운 받아서 어느 경로에 저장하면 될까요?
      이고잉님을 따라서 잘 해왔는데... 그림 부분에서 막혔습니다 ㅠㅠ
      도와주세요~~
    • 세븐나이츠
      감사합니다
    • 대단한 수업입니다. 다 알았다 생각했는데 여기와서 모르고 지냈던 10년을 보충해주네요. 초특급감사!
    • php가 첫취업?
      전체적인 맥락을 이해하기 쉽게 설명해줘서 좋습니다...
      다만...기본 내용자체가 어려운 내용이다 보니...반복적인 연습으로 자기것으로 만들 노력이 필요한거 같습니다
    • funlife
      감사합니다..
    • 감사합니다!!
    • 한지선
      background-attachment : fixed가 신형 안드로이폰에서는 적용되지 않는 것 같던데 egoing님의 parallax강의를 따라하다가 궁금해서 질문 남깁니다.
    • 임지호
      background : 엘리먼트의 배경에 이미지나 색깔 등을 지정할 수 있는 속성
      - background-color : 색깔 지정, -image : 이미지 지정(배경이 투명한 이미지를 쓰면 color와 같이 쓸수있음)
      -repeat : 반복에 관한 설정, -attachment : 스크롤 내릴 때 배경도 같이 내릴지 안내릴지
      -size : 크기에 관한 설정(cover, contain : 손실있어도 꽉차게, 꽉안차도 손실없게), -position : 위치 결정
      background : 축약형
    • 박상민
      잘보았습니다 감사합니다
    • 이성용
      꼭 필요한 내용만 설명하고 나머지는 고기잡는 법을 알려주셔서 전체적인 내용이 잘 이해됩니다.
    • 박정호
      Css 고맙습니다
    • wlsl
      2016.09.12. 완료!
    버전 관리
    egoing
    현재 버전
    선택 버전
    graphittie 자세히 보기