Question

我正在为我的公司制作签名，我想为某些链接添加悬停更改颜色。我知道必须有办法，但所有信息必须包含在一个文件中，我无法使其工作。一切正常，但我无法弄清楚当我悬停时如何使文字改变颜色。

这适用于Mac OSX上的Mail应用程序。

这是我目前的代码：

<table width='320' id="sig" cellspacing='0' cellpadding='0' border-spacing='0' style="width: 320px; margin: 0px; padding:0px;">
<tr>


<!-- The formatting of the image -->
<td width="86" style="width: 86px ;margin-left: 20px; padding: 0px;">
<a href='http://blog.jimdo.com/wp-content/uploads/2014/01/tree-247122.jpg' style="border:none;text-decoration:none;">
<img moz-do-not-send= "true" src= "http://blog.jimdo.com/wp-content/uploads/2014/01/tree-247122.jpg" alt="DatIMG" style=" border:none; width:100px;"></a>
</td>

 <!-- Formats the text to be beside, not below, the image-->     
<td width="10" style="width: 10px; min-width: 10px; max-width: 10px; margin: 0px ; padding: 0px;">&nbsp;</td>
<td valign='top' style="margin: 0px ; padding: 0px;">
<table id="sig2" cellspacing='0' cellpadding='0' border-spacing='0' style="padding: 0px; margin-top: 10px; font-family: 'Helvetica'; font-size: 14px; color: #58585a; border-collapse: collapse;-webkit-text-size-adjust: none;">

<!-- Start of line 1, Name -->
<tr style="margin:0;padding:0;">
<td style="margin:0;padding:0;font-family:'Lucida Grande',sans-serif;white-space:nowrap;">
<strong><a href="mailto:yomomma@me.com " style="border:none;text-decoration:none;"><span style="color:#147ed9">Fats McGruber</span></a></strong>

<br>

<!-- Start of line 2, Position -->
<span style="color:#58585a;">Bossman &bull; Professional Troll &bull; Wizard</span>
</td>
</tr>

<!-- Start of line 3, company name-->
<tr style="margin:0;padding:0;color:#b0a49b;">
<td style="margin:0;padding:0;font-family:'Lucida Grande',sans-serif;white-space:nowrap;">
<a href="http://www.google.com" style="border:none;text-decoration:none;color:#b0b0b0;"><span style="color:#58585a">Company Name<span style="color:#58585a"></a>

<br>
<!-- Start of line 4, location-->
<a href="https://www.google.com/maps/@62,-145,30641m/data=!3m1!1e3" style="border:none;text-decoration:none;color:#58585a;"><span style="color:#58585a">Some City</span></a>
</td>
</tr>

<!-- Start of line 5, Phone -->             
<tr style="margin:0;padding:0;">
<td style="margin:0;padding:0;font-family:'Lucida Grande',sans-serif;white-space:nowrap;">
<a href="tel:+1-555-555-75555" style="margin:0;padding:0;border:none;text-decoration:none;"><span style="color:#58585a">555</span><span style="color:#58585a">.</span><span style="color:#58585a">555</span><span style="color:#e0e0e0">.</span><span style="color:#58585a">5555</span></a>
</td>
</tr>

<!-- Start of line 5, Social Media -->              
<tr style="margin:0;padding:0;"> 
<td style="margin:0;padding:0;font-family:'Lucida Grande',sans-serif;white-space:nowrap;">
<a href="http://facebook.com" style="margin:0;padding:0;border:none;text-decoration:none;">
<span style="color:#58585a">Facebook</span></a>
<span style="color:58585a;">&bull;</span>
<a href="http://twitter.com" style="margin:0;padding:0;border:none;text-decoration:none;">
<span style="color:#58585a">Twitter</span></a>
<span style="color:58585a;">&bull;</span>
<a href="http://instagram.com" style="margin:0;padding:0;border:none;text-decoration:none;">
<span style="color:#58585a">Instagram</span></a>
</td>
</tr>                       

</table>
</td>

<tr>
</table>

Answer 1

你不能通过使用HTML来实现这一点，当悬停时，最简单的方法是改变文本，给每个签名，你想要改变一个类的颜色，然后使用CSS Hover函数来改变颜色。

以下示例

HTML CODE:

<div class="signature1">
<a href="link.html"> YOUR LINK </a>
</div>

CSS CODE:

.signature1{
color: #fff
}

.signature1 hover{
color: FF0000
}

这就是我这样做的方式，因为它更容易，如果你想改变它，未来就一样容易。

将鼠标悬停添加到签名中的链接

1 个答案: