Html 链接/文本旁边的图像

我有一个大问题，可能是一个非常简单的解决方案

这是一个新闻标签，我使用下面的结构添加一个新闻/信息项，它由一个短文本和一个链接组成（我希望能够更改文本/链接颜色或其背景颜色，我不会过度使用这些效果）：

文本

我应该怎么做才能在文本+链接组合之前插入一个10x10px的小图像“bluecircle.png”

我的新手“编码技能”使其中之一（图像或文本+链接消失/不可见）

更新：我不是一个程序员/程序员/开发者。我是一名平面设计师，所以解决方案越简单/越基本越好

更新2：也许这会（或不会）有帮助，但每个新闻/信息项都在这段代码中：

我要真诚地感谢这里所有想帮助我的人！：）
不知道为什么没有像图像+文本+链接这样有效的东西：|

我看到了4种不同的结果：
1.看不到任何内容（新闻项完全消失）
2.文本+链接存在，图像不存在（我检查了不同的路径，将图像定位在两个位置，两个都尝试了）
3.有图像图标，没有文本+链接组合
4.我奇怪的/过时的尝试：我确实有图像，没有文本+链接。
尝试向代码中添加一个类，并将以下内容粘贴到样式表中

.circleimage:before{
content:url('bluecircle.png') 
position:relative;
width: 10px;
height: 10px;
left:-10px;
top:10px;
}

正如@andrew ice所提到的，您需要的是伪类（尽管有很多其他方法可以实现）

希望您能理解这一点：因为span是内联元素，所以可以将img标记与span一起使用，使所有内容都显示在一行中

<p>
 <span> Text </span>
 <span> <img src="path">   </span>
 <span>
   <a href="http:/www.example.com" style="background-color:#fff:>
   <font color="4206FC">TEXT</font>
   </a>
 </span>
<p>


正文

查看css标记、：before和：after。阅读一篇文章，其中可能包含您正在寻找的答案。另外，请查看CSS规则，为您的文本/链接着色，而不是使用过时的
标记，也许把整个内容和你的背景颜色一起放在一节课上谢谢你的回答：）我不确定我能不能快速/深入地学习CSS/HTML，使它在最近的将来发挥作用。）谢谢你的回答！我把代码放在新闻/信息项的上方，下面的代码放在ticker'CSS中，现在连图像都不起作用（断开的图像图标）：（断开的图像图标出现是因为浏览器无法在提供的路径上找到您的图像。因此，如果您的html和图像位于同一文件夹中，url（'bluecircle.png'））可以。但是如果你的图像在“img”文件夹中，请使用url（'img/bluecircle.png'）。如果你想尝试错误，可以使用Chrome的开发者测试不同的url，直到找到正确的url（右键单击图像并检查元素）…如果你想了解更多，请阅读相关路径。我现在将再次尝试更改其路径！谢谢：）可能我做了一些奇怪的事情，但我使用了下面@imguru答案中的代码，将其中的“新闻链接”替换为您答案中的“circleimage”，并将您的CSS代码放在ticker的CSS中。现在文本+链接组合工作得很好，但是图像（我把它放在根目录和“images”目录中）不工作：|尝试将url更改为类似url（'../images/bluecircle.png'）的内容。我几乎发现了问题，某种原因导致构建图像+文本+链接看起来像一个垂直列表：图像位于顶部，文本+链接在它下面，股票代码的高度隐藏了底部部分…：|我想让它拼命工作：|这段代码看起来更像我自己尝试过的代码，但唯一可见的结果是“文本”。
<p id="newsLink">TEXT <a href="http:/www.example.com" style="background-color:#ffffff"><font color="4206FC">TEXT</font></a></p>

#newsLink:before{
content:url('bluecircle.png');
}

<p>
 <span> Text </span>
 <span> <img src="path">   </span>
 <span>
   <a href="http:/www.example.com" style="background-color:#fff:>
   <font color="4206FC">TEXT</font>
   </a>
 </span>
<p>