나는이 말을하자 div로 width: 300px하고 height: 200px
나는이 내부에 이미지를 원하는 div수평 및 수직 상관없이 중앙에 이미지가 크거나보다 작은 경우 div;
작은 이미지의 경우 margin: 0 auto잘 작동하지만 높은 이미지가 오른쪽으로 돌출되어 중앙에 있지 않습니다.
더 큰 이미지의 경우 다음과 같이 작동합니다.
height: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
이들의 조합을 찾을 수 없었고이 이미지를 완벽하게 중앙에 배치하는 방법을 찾지 못했습니다.
추가 position: absolute로 img및 position: relative에div
.el {
position: relative;
width: 100px;
height: 100px;
border: 1px solid black;
margin: 50px 150px;
}
img {
opacity: 0.4;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
position: absolute;
}<div class="el">
<img src="http://placehold.it/350x150">
<img src="http://placehold.it/50x50/000000/ffffff">
</div>이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다