이미지확대를하니 한쪽으로 쏠려서 확대가됩니다. 채택완료
이미지확대를하니 한쪽으로 쏠려서 확대가됩니다.
.lt_bn li img{max-width:1000px;width:170%;height:170%;vertical-align:top}
이 소스를 사용해서 1번 이미지를 170%확대하면 2번처럼 확대가 됩니다.
원하는건 3번처럼 가운데 기준으로 확대를 원합니다.
그래서 ;Horizontal-align:center 를 추가했는데 이게 아닌것같고 어떤 코드를 추가해야할까요??
답변 1개
채택된 답변
+20 포인트
4년 전
https://codepen.io/4bigchoi23/pen/rNWJOGO
Copy
.img { display: block; width: 400px; height: 300px; overflow: hidden; float: left; }
.img1 img { display: block; width: 100%; height: 100%; }
.img2 img { display: block; width: 100%; height: auto; transform: scale(1.7); }
.img3 img { display: block; width: 100%; height: auto; transition: transform 0.25s ease-in-out; }
.img3 img:hover { transform: scale(1.7); }
.img4 img { display: block; width: 170%; height: auto; position: relative; left:50%; top: 50%; transform: translateX(-50%) translateY(-50%); }
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
k
kajama
4년 전
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
알려주신 소스는다른곳에 유용하게 사용하겠습니다.