홈>
이미지를 div에 완전히 맞추기 위해 Jquery를 통해 CSS/설정을 변경하는 데 어려움이 있습니다. 사진을 div에 완벽하게 맞추려면 어떻게해야합니까?
https://jsfiddle.net/teonxyku/1/
다음을 시도했습니다 :
#slider1_container img {
max-width:100%;
max-height:100%;
}
그러나 슬라이더가 더 깨졌습니다.
jsfiddle을 붙여 넣을 것이므로 전체 코드를 더 잘 이해할 수 있습니다. 미리보기입니다.
http://fiddle.jshell.net/teonxyku/1/show/ 빛/
- 답변 # 1
관련 자료
- javascript - 이미지가 처음에는 완전히로드되지 않고 새로 고침 후에 만로드됩니다
- python - 파이 게임 배경 이미지가 완전히로드되지 않음
- ajax - HTML에 표시하기 위해 자바 스크립트 내의 Image Ranomizer API에로드
- CSS를 사용하여 열 내에서 이미지 선택
- google drive api - 웹 앱의 태그에 사용 된 이미지를 "회사 내의 모든 사람"으로 제한하는 방법은 무엇입니까?
- reactjs - 공간을 채우는 카드 내에서 이미지 만들기
- html - 목록 내 한 이미지의 이미지 크기 변경
- python - flipkart 사이트의 div 태그에있는 이미지 태그에서 이미지 URL을 가져 오는 방법은 무엇입니까?
- html - div 내에서 이미지를 세로 및 가로로 가운데에 배치하는 방법
- Jssor Slider - json 슬라이더 - 슬라이더를 다시 만든 후 이미지 슬라이더 (사진을 끌 수 없음)가 작동하지 않습니다
- amazon web services - 코드 파이프 라인 내에 빌드 된 도커 이미지를 블루/그린 배포를 사용하여 배포 단계로 가져 오는 방법
관련 질문
- javascript : 부트 스트랩 모달은 닫은 후에도 몸에 패딩을 계속 추가합니다.
- javascript : 동일한 클래스와 같은 두 요소를 고유 한 ID로 제공하십시오.
- javascript : 내가 전에 넣은 상자 아래로 어떻게 상자 아래로 만들 수 있습니까?
- javascript : 자바 내의 값을 기반으로 상위 DIV에 사용자 지정 HTML 속성 추가태그 현재 웹 페이지 링크 일치
- javascript : IE 고해상도 이미지가 작은 크기로 설정된 경우 Thumbnail Pixelation
- jquery : 수평 스크롤의 끝을 탐지합니다
- jquery : 응답 성 부트 스트랩 회전식 여러 열 항목의 여러 열
- javascript : Flex 슬라이더 이미지 가운데가 아닙니다
- javascript : 이미지없이 이미지를 링크로 만듭니다(새 탭 /창에서 열린 링크가 작동하지 않음)
- CSS /JavaScript : 여러 상태로 순환 메뉴를 회전시키는 방법은 무엇입니까?
클래식의 오래된 해결책은 이미지를 div의 배경으로 만드는 것입니다
<프리 클래스 = "조각 코드 - CSS 랭 CSS를 prettyprint 오버라이드 (override)">
#slider1_container { width: 200px; height: 160px; background: url('https://images.unsplash.com/photo-1518791841217-8f162f1e1131?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&w=1000&q=80'); background-size: cover; background-repeat: no-repeat; }