본문 바로가기

background-image2

2021-07-03 (82일차) background-image에 대하여 (복습) - background-image : img태그를 사용하지 않고 이미지를 넣는 css값 ※ 이미지 태그 주요 콘텐츠는 img태그 사용, 배경역할로 꾸밈요소로 쓰인다면 background-image 사용 img 태그 : scale를 줄였을 때, 정비율로 줄어들고 비율이 달라지만 이미지가 찌그러짐 background-image : 옵션을 잘 맞춰주면 더 편하게 보여줄 수 있음 - background-size : contain; : 이미지 고유비율로 들어가고,나머지 공간은 이미지가 반복됨 ※ no-repeat 사용하면 나머지는 흰여백으로 표시됨 ㄴ background-color로 색상갑을 줄 수 있음 - background-size : cover; : 어떻게든 이미지가 반복되지 않고, 꽉 차게 나옴 2021. 7. 4.
2021-07-01 (80일차) background-image, 고정비율, css 이미지 고정비율, 슬라이더 좌우 보이게 하기, background-image에 텍스트 넣기 165~166강 ( 이미지 비율 ) 스와이퍼 19강 - 이미지가 안 나오는 경우 : 포스트이미지 사이트 (https://postimages.org/) - 스프라이트이미지 사용방법 : background-image 사용 - background-image : url( ) ; : 태그의 배경으로 이미지를 넣는 명령 : 이미지의 크기가 정해진 너비보다 작다면 자동으로 이미지가 반복되어 나옴 - background-repeat : norepeat : 이미지 반복을 멈춰준다. - background-position : 가로px 세로px : background-image를 특정너비로 자르고 사용하고 싶을 때 사용 +px : ← ↑ - px : → ↓ - background-size : contain : 이미지가 잘리.. 2021. 7. 3.