HTML & CSS
CSS:: background property
비오스터딩
2020. 8. 22. 19:40
{background: color || image || repeat || attachment || position}
> image : url("경로 입력")
> repeat : repeat-x, repeat-y, no-repeat
> attachment : fixed
> position : px, %, top, right, bottome, left, center
- px: left기준 top기준
(ex. position: 20px 30px)
>> 속성 값을 입력할 때 ','를 넣어주면 다른 배경의 속성값으로 인식되므로,
한 배경의 여러 속성값을 입력하려면 ' '(공백)을 사용해야함.
{background-size: px, %, cover, contain }
-cover : 배경이미지 비율 그대로 큰 축에 배경을 맞춤(일부 배경 이미지 잘림)
-contain : 배경이미지 비율 그대로 짧은 축에 배경을 맞춤 (배경 이미지 전체가 요소 안으로 들어옴)
반응형