使用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; 
} 

注：这些例子被物体标签的子删除段落标记。