CSS🔧/css background2 background-image / size 변경 / 가상선택자 여기 동일 크기의 목록에 배경이미지를 변경해보자 . .main_new li>a { display: inline-block; width: 180px; height: 180px; border-radius: 50%; border: 1px solid #CCCCCC; background: url(../images/main_newmenu_dounut.png) no-repeat 50%; background-size: 200px; } 먼저 첫번째 아이콘 이미지를 삽입 후 크기조정 .main_new li:nth-child(2) a { background-image: url(../images/main_newmenu_drink.png) ; background-size: 80%; } 그리고 부모의 2째 자식을 선택해라를 li.. 2022. 10. 23. css background: url(../)no-repeat 배경 써야할 경우 1 레이아웃크기보다 큰 이미지 사용시 (단, 데이터로 들어오는 클릭되는 이미지일경우 img로 넣는경우가 많음) 2 내용을 꾸미는 이미지(아이콘) 3 반복이미지 4 :hover로 이미지나 배경위치 변경 5 sprite image 사용시 6 fixed배경 사용시 (사용자제, 모바일에서 안됨) 7 투명배경 사용시 8 배경이미지를 요소에 가득채울때(full배경) 속성값 속성 background:색 url(../images/파일명.확장자) no-repeat x y위치 / cover(크기) (fixed 모바일 적용안됨 사용X) 예시 background: yellowgreen url(../images/ci-shinhan-pc.png) no-repeat right 100px bottom 100px /.. 2022. 9. 13. 이전 1 다음
