background-size : cover / contain
2017. 8. 8. 21:29ㆍ[개발] 지식/CSS
background-size : cover
비율은 유지한 채, 최대한 부모 엘리먼트에 꽉 채운다.
예를들어 가로 세로가 200px 300px 인 이미지가 가로 세로 300px의 엘리먼트 안에 있을 때,
'cover' 는 가로를 300px까지 늘리고 세로의 일부를 자른다.
background-size : contian
비율은 유지한 채, 부모 엘리먼트 안에서 가능한 모든 것을 보여준다.
가로 세로가 200px 300px인 이미지가 가로 세로 300px 엘리먼트 안에 있을 때
더 긴 세로 300px 기준으로 이미지를 맞추고 가로는 동일 비율로 200px을 유지한다.
'[개발] 지식 > CSS' 카테고리의 다른 글
user-select (0) | 2017.12.04 |
---|---|
말줄임 처리 (0) | 2017.11.16 |
inline-block 으로 했을때 요소간 여백 없애기 (0) | 2017.03.27 |
IE에서 Input 태그 우측 delete('X") 버튼 없애기 (0) | 2016.12.16 |
Img(인라인) 수직정렬 (0) | 2016.12.07 |
<