文本兩邊的浮動圖像

我想讓圖像浮動在一個段落的兩邊。但是，當我這樣做時，只有左邊的img保持在隊列中，而第二個簡單地在文本下方。我將如何解決這個問題？文本兩邊的浮動圖像

<img class="logo-imgl" src="img/logo.png" height= 300px width= 400px /> 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ultricies nisl ut leo interdum cursus. In interdum ipsum dui, id faucibus tellus consequat nec. Fusce viverra hendrerit diam, eget ultrices lacus. Sed porta, ex ut auctor dignissim, arcu ante condimentum justo, et cursus sem metus et purus. Pellentesque imperdiet ligula et blandit tristique. Proin placerat suscipit nisi vel viverra. Proin nec neque ut dolor blandit tincidunt id eget ligula. Mauris et tortor at leo pretium lacinia.</p> 
<img class="logo-imgr" src="img/logo.png" height= 300px width= 400px />

這裏是CSS：

.logo-imgl{ 
    float:left; 
} 
.logo-imgr{ 
    float:right; 
}

來源

2016-04-01 Crisis

段落 – j08691

段前將兩個圖像。我將這兩種尺寸都改爲只有30px的寬度，以便在片段中正確顯示。

.logo-imgl{ 
 
    float:left; 
 
} 
 
.logo-imgr{ 
 
    float:right; 
 
}

<img class="logo-imgl" src="img/logo.png" height="30" width="40" /> 
 
<img class="logo-imgr" src="img/logo.png" height="30" width="40" /> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ultricies nisl ut leo interdum cursus. In interdum ipsum dui, id faucibus tellus consequat nec. Fusce viverra hendrerit diam, eget ultrices lacus. Sed porta, ex ut auctor dignissim, arcu ante condimentum justo, et cursus sem metus et purus. Pellentesque imperdiet ligula et blandit tristique. Proin placerat suscipit nisi vel viverra. Proin nec neque ut dolor blandit tincidunt id eget ligula. Mauris et tortor at leo pretium lacinia.</p>

來源

2016-04-01 16:15:14 omnichad

謝謝之前把第二圖像。這是我需要的。 – Crisis

嘗試這是自舉

<div class="container"> 
     <div class="row"> 
     <div class="col-md-4"> 
      <img class="logo-imgl" src="img/logo.png" height="30" width="40" /> 
     </div> 
     <div class="col-md-4"> 
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ultricies nisl ut leo interdum cursus. In interdum ipsum dui, id faucibus tellus consequat nec. Fusce viverra hendrerit diam, eget ultrices lacus. Sed porta, ex ut auctor dignissim, arcu ante condimentum justo, et cursus sem metus et purus. Pellentesque imperdiet ligula et blandit tristique. Proin placerat suscipit nisi vel viverra. Proin nec neque ut dolor blandit tincidunt id eget ligula. Mauris et tortor at leo pretium lacinia.</p> 
     </div> 
     <div class="col-md-4"> 
      <img class="logo-imgl" src="img/logo.png" height="30" width="40" /> 
     </div> 
     </div> 
    </div>

來源

2016-04-01 16:23:24

謝謝。這效果很好！ – Crisis

文本兩邊的浮動圖像

回答

相關問題