Wordpress 如何在不重叠文本和链接的情况下在此代码段中创建2个CSS图像？

我在WordPress小部件中有一个代码片段：

<ul style="list-style-type: disc;">
<li><a title="Why Choose NetPrezence?" 
href="http://www.netprezence.net/choose-netprezence/">Why Choose NetPrezence?</a></li>

<li><a title="Meet the Founder of NetPrezence" href="http://www.netprezence.net/about-
me/">Meet the Founder</a></li>

<li><a title="Contact NetPrezence" href="http://www.netprezence.net/contact/">Contact 
NetPrezence</a></li>

<li><a title="Client Testimonials" href="http://www.netprezence.net/testimonials
/">Client Testimonials</a></li>

<li><a title="Porfolio" href="http://www.domain.com/portfolio
/">Portfolio</a></li>
</ul>

<p><strong>NetPrezence LLC</strong><br />12870 Farmington 
Rd.<br />Livonia, MI 48150<br />888-888-8888<br />∴ mail@netprezence.net</p>

NetPrezence LLC
12870法明顿
密歇根州利沃尼亚路48150号888-888-8888
∴ mail@netprezence.net

当前输出如下所示：

ul:before {
    content:url('https://www.gravatar.com/avatar/');
}

p {
    position:relative;
}

p:before {
    display:block;
    position:absolute;
    background-image:url('https://www.gravatar.com/avatar/');
    background-size:15px 15px;
    content:'';
    width:15px;
    height:15px;
    left:0;
    bottom:0;
}

我想做的是使用CSS在左上方添加我的公司徽标，而不是插入图像--而不重叠任何文本或链接

另外，我想在左下角的电子邮件地址的左侧添加一个电子邮件图标，其中有一个∴ 象征。当然，我不想掩盖电子邮件地址

任何帮助我实现这一目标的指导都将不胜感激

您可以使用

ul

上的

：before

插入徽标。不幸的是，电子邮件只有一个

p

，没有可用的子元素，因此您可能不得不求助于如下硬编码：

ul:before {
    content:url('https://www.gravatar.com/avatar/');
}

p {
    position:relative;
}

p:before {
    display:block;
    position:absolute;
    background-image:url('https://www.gravatar.com/avatar/');
    background-size:15px 15px;
    content:'';
    width:15px;
    height:15px;
    left:0;
    bottom:0;
}

---

谢谢你花时间回答，特雷特里，谢谢你的提琴。看起来我得稍微摆弄一下，也许是用div标签，但我认为你给我指明了正确的方向。再次感谢！