Html 如何在图像和居中位置下获取行动调用按钮？

我正在尝试创建一个html电子邮件时事通讯，并实现这个外观

到目前为止，我在一个表中有两个图像，每个图像都在它自己的表数据中

<table align="center"> 
        <tr>
            <td width="250" bgcolor="#ffffff">
                <img src="PickYourSale-wrinkles-v2.jpg" width="249" height="249">
            </td>

            <td width="250" bgcolor="#ffffff">
                <img src="PickYourSale-NEW-v2.jpg" width="249" height="249">
            </td>
        </tr>
</table>

我正试图弄清楚如何才能得到像这张图中一样的“行动号召”按钮。有人知道怎么做吗

jshiddle-

您可以尝试这种方法

 <table align="center"> 
    <tr>
        <td width="250" bgcolor="#ffffff">
            <img src="PickYourSale-wrinkles-v2.jpg" width="249" height="249" alt="example">
        </td>

        <td width="250" bgcolor="#ffffff">
            <img src="PickYourSale-NEW-v2.jpg" width="249" height="249" alt="example">
        </td>
    </tr>   
    <tr>                  
        <td width="250"  style = "text-align:center">
           <button>click me</button>
        </td>                    
        <td width="250"  style = "text-align:center">
            <button>click me</button>
        </td>  
    </tr>                 
</table>

点击我
点击我

您可以通过CSS和添加额外的按钮行轻松实现这一点

看看这个片段

表格#新字母{
字体系列：无衬线；
}
按钮{
文本对齐：居中；
}
a、 钮扣{
填充：10px；
边界半径：4px；
背景：靛蓝；
颜色：白色；
字体大小：粗体；
文字装饰：下划线；
}