Кликабельная таблица HTML в электронной почте - PullRequest
Новая
       12

Кликабельная таблица HTML в электронной почте

0 голосов
/ 05 октября 2018

Я пытаюсь создать кликабельную HTML-таблицу, в которой текст не выглядит гиперссылочным - и это делает всю таблицу связанной.Проведя часы, просматривая предыдущие посты на эту тему, я подумал, что понял код и заставил его работать в редакторе HTML.

Однако, когда я отправляю себе тестовые образцы электронной почты, код не работает.В Outlook таблица выглядит кликабельной, но не связана.В Gmail он не отображается кликабельно и не связан.

Очень полезный комментатор, дайте мне знать, что у меня не может быть тега <a> вне таблицы, но если я переместу тег <a> внутрь <td>, он будет связывать только текст, а не всю таблицу.

Есть ли обходной путь для этого?

Вот мой код: 

<a href="http://google.com" style="text-decoration:none">
  <table align="center" border="1" cellpadding="10" cellspacing="0" style="width:200px;">
     <tbody>
         <tr id="clickable" style="cursor:pointer">    
            <td style="text-align: center;"><strong>TEXT</strong></td>
            <td style="text-align: center;"><strong>TEXT</strong></td>
            <td style="text-align: center;"><strong>TEXT</strong></td>
         </tr>
         <tr id="clickable" style="cursor:pointer">
            <td style="text-align: center;">
               <strong><span style="color:#0c85c8;">TEXT</span>-<span style="color:#e7413D;">TEXT</span></strong>
            </td>
            <td style="text-align: center;">
                <strong><span style="color:#0c85c8;">TEXT</span>-<span style="color:#e7413D;">TEXT</span></strong>
            </td>
            <td style="text-align: center;">
                <strong><span style="color:#0c85c8;">TEXT</span>-<span style="color:#e7413D;">TEXT</span></strong>
            </td>
         </tr>
      </tbody>
  </table>
</a>

Заранее большое спасибо

1 Ответ

0 голосов
/ 05 октября 2018

Добавьте стиль color: inherit; в тег <a>.Это должно выглядеть так: 

<a href="http://google.com" style="text-decoration:none;color:inherit">


<a href="http://google.com" style="text-decoration:none;color:inherit">
      <table align="center" border="1" cellpadding="10" cellspacing="0" style="width:200px;">
         <tbody>
             <tr id="clickable" style="cursor:pointer">
                <td style="text-align: center;"><strong>TEXT</strong></td>
                <td style="text-align: center;"><strong>TEXT</strong></td>
                <td style="text-align: center;"><strong>TEXT</strong></td>
             </tr>
             <tr id="clickable" style="cursor:pointer">
                <td style="text-align: center;">
                   <strong><span style="color:#0c85c8;">TEXT</span>-<span style="color:#e7413D;">TEXT</span></strong>
                </td>
                <td style="text-align: center;">
                    <strong><span style="color:#0c85c8;">TEXT</span>-<span style="color:#e7413D;">TEXT</span></strong>
                </td>
                <td style="text-align: center;">
                    <strong><span style="color:#0c85c8;">TEXT</span>-<span style="color:#e7413D;">TEXT</span></strong>
                </td>
             </tr>
          </tbody>
      </table>
    </a>
...