如何將文字圖像與

類

我希望把TEXT的IMG，但我不能改變的代碼..如何將文字圖像與

任何CSS將工作

我已經試過，但它不是正確

.n3 { 
 
    position: relative; 
 
} 
 

 
.n4 { 
 
    position: absolute; 
 
    bottom: 7px; 
 
    left: 12px; 
 
    padding: 1px; 
 
    box-sizing: border-box; 
 
    font-size: 10px; 
 
    color: rgba(255, 255, 255, 1); 
 
    text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF; 
 
}

<div class="n1" id="n1"> 
 
    <div class="n2"> 
 
    <a class="n3" href="URL"> 
 
     <span class="n4">TEXT</span> 
 
    </a> <span class="n5"><a href="URL"><img class="n6" src="https://placehold.it/350x150"></a></span> 
 
    <a class="n3" href="URL"> 
 
     <span class="n4">TEXT</span> 
 
    </a> <span class="n5"><a href="URL"><img class="n6" src="https://placehold.it/350x150"></a></span> 
 
    <a class="n3" href="URL"> 
 
     <span class="n4">TEXT</span> 
 
    </a> <span class="n5"><a href="URL"><img class="n6" src="https://placehold.it/350x150"></a></span> 
 
    </div> 
 
</div>

來源

2017-04-20 Ninja Anime

什麼是「不正常」呢？什麼是預期的輸出？ – mplungjan

請修復我製作的片段以使用您需要的圖片大小 - 如果圖片在寬度大於其組合寬度的屏幕上 – mplungjan

我不認爲你想要什麼是可能的，如果你不能改變的HTML，如果你不能使用JavaScript工作。我的意思是，我能達到您想要顯示的唯一方式是通過欺騙有點...

.n3 {display:none;} 
 

 
.n5 > a {position:relative;} 
 

 
.n5 > a::after { 
 
    position: absolute; 
 
    content:'TEXT'; 
 
    bottom: 7px; 
 
    left: 12px; 
 
    padding: 1px; 
 
    box-sizing: border-box; 
 
    font-size: 10px; 
 
    color: rgba(255, 255, 255, 1); 
 
    text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF; 
 
}

<div class="n1" id="n1"> 
 
    <div class="n2"> 
 
    <a class="n3" href="URL"> 
 
     <span class="n4">TEXT</span> 
 
    </a> <span class="n5"><a href="URL"><img class="n6" src="https://placehold.it/350x150"></a></span> 
 
    <a class="n3" href="URL"> 
 
     <span class="n4">TEXT</span> 
 
    </a> <span class="n5"><a href="URL"><img class="n6" src="https://placehold.it/350x150"></a></span> 
 
    <a class="n3" href="URL"> 
 
     <span class="n4">TEXT</span> 
 
    </a> <span class="n5"><a href="URL"><img class="n6" src="https://placehold.it/350x150"></a></span> 
 
    </div> 
 
</div>

來源

2017-04-21 11:13:33

如何將文字圖像與

回答

相關問題