配色一:
<div>
<style type="text/css">
@keyframes mymoveshengri{
from{
opacity: 0;
}
to{
opacity: 1;
}
}
#shengri{
animation: mymoveshengri 4s;
animation-fill-mode: both;
box-shadow: 0px 0px 20px #af7588;
border-radius: 15px;
position: relative;
}
#shengrilink{
animation: mymoveshengri 3s;
animation-delay: 2s;
animation-fill-mode: both;
}
#linklink{
animation: mymoveshengri 2s;
animation-delay: 3s;
animation-fill-mode: both;
}
#signname{
animation: mymoveshengri 4s;
animation-delay: 5s;
animation-fill-mode: both;
}
</style>
<table style="background-image: url(https://pp.lanyin.net/118851/photo/Mon/2018/04/82547_00a115227602151fff5a5542ea9d7.png); background-repeat: repeat-y; position: relative; background-size: 450px;" align="center" width="450">
<tbody>
<tr>
<td align="center">
<table style="background-color: rgba(255, 255, 255, 0.5);" width="450">
<tbody>
<tr>
<td height="70"></td>
</tr>
<tr>
<td style="position: absolute; right: 70px;top: 30px;border-width: 0px 4px 0px 4px;border-color: #ddd2db;border-style: solid;border-radius: 55px;width: 65px;text-align: center;" id="linklink">
<font color="#ddd2db" style="font-size: 55px;">艾</font>
</td>
</tr>
<tr>
<td style="position: absolute; right: 10px;top: 90px;border-width: 0px 4px 0px 4px;border-color: #ddd2db;border-style: solid;border-radius: 55px;width: 65px;text-align: center;" id="linklink">
<font color="#ddd2db" style="font-size: 55px;">迪</font>
</td>
</tr>
<tr>
<td align="center">
<table width="350" id="shengri">
<tbody>
<tr>
<td align="center" style="padding: 16px;">
<font color="#a7739f" style="font-size: 15px; line-height: 150%; text-shadow: 0px 1px 0px white, 0px -1px 0px white,-1px 1px 0px white,-1px 0px 0px white,-1px -1px 0px white,1px 1px 0px white,1px 0px 0px white,1px -1px 0px white;">一共配了两种颜色,<br>一种是根据背景图配的色,<br>一种是根据挂件配的色,<br>你看看你喜欢哪一种吧。<br>字数大概我写的这么多<br>可以适当增加或减少。<br>文字文字文字文字<br></font>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="position: absolute; bottom: 0px; right: 0px;">
<a href="[url]https://www.paipai.fm/r6716897u77855910"[/url] id="shengrilink"><img src="[url]https://pp.lanyin.net/118851/photo/Mon/2018/03/82547_3bbf15218599933894110be8e249b.png"[/url] width="150" onmouseover="this.src='[url]https://pp.lanyin.net/118851/photo/Mon/2018/04/82547_3e51152270329292904b3071695a7.png'"[/url] onmouseout="this.src='[url]https://pp.lanyin.net/118851/photo/Mon/2018/03/82547_3bbf15218599933894110be8e249b.png'"></a>[/url]
</td>
</tr>
<tr>
<td style="position: absolute; left: 180px; bottom: 40px;" id="linklink">
<font color="#c6b2c3">生日链接点右边☞</font>
</td>
</tr>
<tr>
<td style="position: absolute; left: 10px; bottom: 30px; transform: rotate(45deg);" id="signname">
<font color="#c6b2c3" style="font-size: 18px;"><b>窈窈制</b></font>
</td>
</tr>
<tr>
<td height="80">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
配色二:
<div>
<style type="text/css">
@keyframes mymoveshengri{
from{
opacity: 0;
}
to{
opacity: 1;
}
}
#shengri{
animation: mymoveshengri 4s;
animation-fill-mode: both;
box-shadow: 0px 0px 20px #42776d;
border-radius: 15px;
position: relative;
}
#shengrilink{
animation: mymoveshengri 3s;
animation-delay: 2s;
animation-fill-mode: both;
}
#linklink{
animation: mymoveshengri 2s;
animation-delay: 3s;
animation-fill-mode: both;
}
#signname{
animation: mymoveshengri 4s;
animation-delay: 5s;
animation-fill-mode: both;
}
</style>
<table style="background-image: url(https://pp.lanyin.net/118851/photo/Mon/2018/04/82547_00a115227602151fff5a5542ea9d7.png); background-repeat: repeat-y; position: relative; background-size: 450px;" align="center" width="450">
<tbody>
<tr>
<td align="center">
<table style="background-color: rgba(255, 255, 255, 0.5);" width="450">
<tbody>
<tr>
<td height="70"></td>
</tr>
<tr>
<td style="position: absolute; right: 70px;top: 30px;border-width: 0px 4px 0px 4px;border-color: #c8d8d3;border-style: solid;border-radius: 55px;width: 65px;text-align: center;" id="linklink">
<font color="#c8d8d3" style="font-size: 55px;">艾</font>
</td>
</tr>
<tr>
<td style="position: absolute; right: 10px;top: 90px;border-width: 0px 4px 0px 4px;border-color: #c8d8d3;border-style: solid;border-radius: 55px;width: 65px;text-align: center;" id="linklink">
<font color="#c8d8d3" style="font-size: 55px;">迪</font>
</td>
</tr>
<tr>
<td align="center">
<table width="350" id="shengri">
<tbody>
<tr>
<td align="center" style="padding: 16px;">
<font color="#46748b" style="font-size: 15px; line-height: 150%; text-shadow: 0px 1px 0px white, 0px -1px 0px white,-1px 1px 0px white,-1px 0px 0px white,-1px -1px 0px white,1px 1px 0px white,1px 0px 0px white,1px -1px 0px white;">你这张图比较长<br>所以字数可以多一点<br>但是不能太多<br>也不能太少<br>大概我写的这么多最好<br>稍微多些少些没关系<br>你可以具体看背景图<br>文字文字文字文字文字文字<br>文字文字文字文字文字文字</font>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="position: absolute; bottom: 0px; right: 0px;">
<a href="[url]https://www.paipai.fm/r6716897u77855910"[/url] id="shengrilink"><img src="[url]https://pp.lanyin.net/118851/photo/Mon/2018/03/82547_3bbf15218599933894110be8e249b.png"[/url] width="150" onmouseover="this.src='[url]https://pp.lanyin.net/118851/photo/Mon/2018/04/82547_3e51152270329292904b3071695a7.png'"[/url] onmouseout="this.src='[url]https://pp.lanyin.net/118851/photo/Mon/2018/03/82547_3bbf15218599933894110be8e249b.png'"></a>[/url]
</td>
</tr>
<tr>
<td style="position: absolute; left: 180px; bottom: 40px;" id="linklink">
<font color="#758992">生日链接点右边☞</font>
</td>
</tr>
<tr>
<td style="position: absolute; left: 10px; bottom: 30px; transform: rotate(45deg);" id="signname">
<font color="#a9b7b6" style="font-size: 18px;"><b>窈窈制</b></font>
</td>
</tr>
<tr>
<td height="80">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>