728x90 300x250 SMALL Front-end/CSS65 css background-image 여러개 적용하기 .bg{ width: 62px; height: 34px; background-size: 26px 34px, 26px 34px; background-position:0px 0px, 36px 0px; background-repeat: no-repeat; background-image: url(../images/icon1.png), url(../images/icon2.png); } background-image 에 ','로 구분하여 background 이미지 개수 만큼 작성한다. 여러 개의 이미지를 나란히 적용하기 위해 width 값을 이미지 전제 넓이로 작성한다. background-position 을 이용해 각각의 위치를 잡아준다. 2022. 8. 3. a태그 안에 img 공백 없애기 a>img 태그 안에 공백 생기는 오류 해결하기 해결방법 1 - 이미지 태그를 블럭 속성으로 만들면 공백이 어진다. img{display:block;} 해결방법2 - 이미지 정렬 img{vertical-align:bottom;} /*vertical-align:top을 해도 상관없다.*/ 2022. 7. 18. 말줄임 ellipsis처리 a {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} 2022. 6. 4. [css] 화면 줄일 때 잘리는 게 아니라 밑으로 떨어지게 하려면? .container { border: 5px solid #ffcc5c; display: flex; justify-content: flex-start; flex-wrap: wrap; //이렇게 지정해준다. } 2022. 5. 24. 이전 1 2 3 4 5 6 ··· 17 다음 728x90 반응형 LIST