Question

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

这是一个新闻自动收录机，我使用下面的结构添加单个新闻/信息ITEM，其中包含一个简短的TEXT和一个链接（我希望能够更改文本/链接颜色或其背景颜色和我'我不会过度使用这种影响））：

<p>TEXT <a href="http:/www.example.com" style="background-color:#ffffff">
    <font color="4206FC">TEXT</font>
</a></p>

如何在文字+链接组合之前插入一个小的10x10px图像“bluecircle.png”？

我的新手“编码技巧”使其中一个（图像或文字+链接DISAPPEAR /隐形）。

更新：我不是编码员/程序员/开发人员。我是一名平面设计师，所以THE SIMPLER /更基本的解决方案对我来说更好。

UPDATE2：也许这可以（或不能）帮助，但每个新闻/信息项都在此代码中：<li id='item1'></li>。

我真诚地感谢这里有谁想帮助我！:) 不知道为什么没有像图像+文字+链接那样工作：|

我看到4种不同的结果： 1.什么都看不到（新闻项目完全消失） 2.文本+链接在那里，图像不存在（我检查了不同的路径，在2个地方找到图像，尝试了两者） 3.图像ICON在那里，文本+链接组合不存在 4.我的奇怪/过时的尝试使它工作：我在那里有IMAGE而没有文字+链接。

Answer 1

尝试在代码中添加一个类，并将以下内容粘贴到样式表中。

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

Answer 2

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

<p id="newsLink">TEXT <a href="http:/www.example.com" style="background-color:#ffffff"><font color="4206FC">TEXT</font></a></p>

在CSS中添加以下内容：

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

Answer 3

希望您能理解这一点：由于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>

链接/文本旁边的图像

3 个答案: