使用svg圖像對齊文本

Question

如何將svg對象旁邊的下一個。

結果我得到的是：

我想是增加旁的文字SVG圖像結果：

這裏是HTML：

<div class="alert alert-success smallFont" id="instruction"> 
<object data="images/information.svg" type="image/svg+xml" id="object"> 
<p id="mapsInstructionOne" class="mapsInstructionOne" align="center"></p> 
</object> 
</div> 

Answer 1

你可以使用CSS實現這一點，並在標記中進行更改：

HTML：

<div class="alert alert-success smallFont" id="instruction"> 
<p id="mapsInstructionOne" class="mapsInstructionOne" align="center"></p> 
<object data="images/information.svg" type="image/svg+xml" id="object"></object>  
</div> 

然後在你的CSS文件，你可以使用段落標籤的浮動：

#mapsInstructionOne { 
    float: right; 
} 

根據您想要的文字換行，你也可以選擇浮動對象標籤代替。在這種情況下 -

HTML：

<div class="alert alert-success smallFont" id="instruction"> 
<object data="images/information.svg" type="image/svg+xml" id="object"></object> 
<p id="mapsInstructionOne" class="mapsInstructionOne" align="center"></p> 
</div> 

CSS：

#object { 
    float: left; 
} 

注：這些例子被物體標籤的子刪除段落標記。