"position : absolute"를 사용하지 않고 이미지에 텍스트를 가져 오는 방법은 무엇입니까?

Question

이미지를 텍스트로 가져 오는 유일한 방법입니까? 직위 : 절대; 상단 : 0; (0 또는 이미지가있는 모든 위치에서)

다른 방법으로이 작업을 수행 할 수 있습니까?

Answer 1

html 레이아웃에 따라 다른 옵션이 있습니다. 배경 이미지를 토스트가 주석으로 사용함. 또한 음수 마진을 사용할 수 있습니다. 이 예제처럼 :

.myimage{ 
 
    background:red; 
 
    display:block; 
 
    margin-bottom: -50px; 
 
} 
 
    
 
.mytext{ 
 
    color:white; 
 
}

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red block" width="100" height="100" class="myimage" /> 
 
<div class="mytext"> 
 
[SOME TEXT] 
 
</div>