AWS SES: как правильно использовать CSS

Я новичок в HTML и CSS. Я хочу отправить электронное письмо (с функцией send_templated_email) с помощью AWS SES. Вот очень упрощенный пример html (я загрузил файл css на Google Диск):

<!DOCTYPE html>
<html>

<head>
    <title>HTML Pandas Dataframe with CSS</title>
    <meta charset = "UTF-8">
    <meta name = "viewport" content = "width=device-width">
    <link rel = "stylesheet" type = "text/css" href = "https://drive.google.com/uc?export=view&id=1WXiOVD4Dse4sAyyhYmtGYFXXu5p7U1GO" />
    <title></title>
</head>


<body>
    <table>

        <tr style = "color: rgb(119,119,119);font-size: 16.0px;">
            <td align = "left">
                <p> </p>
                <p>Hi,</p>
                <p>Welcome!</p>

                <br>
                <table border = "1" class = "dataframe mystyle">
                    <thead>
                        <tr style = "text-align: right;">
                            <th>id</th>
                            <th>name</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>1</td>
                            <td>Jack</td>
                        </tr>
                    </tbody>
                </table>
                <br>
    </table>
</body>

</html>

когда я отправляю электронную почту через AWS SES, я хочу, чтобы она выглядела так:

но это выглядит так:

codepen.io/dreambold/pen/PoBobbr вроде работает корректно

— 19.12.2022 11:25

@DreamBold — В каких почтовых клиентах вы это тестируете?

— 19.12.2022 11:26

Я мало что знаю об Amazon SES, но я ожидаю, что некоторые функции разных источников могут блокировать внешний CSS, подобный этому.

— 19.12.2022 11:26

Вы также пытались использовать <style>...</style> вместо файла css?

— 19.12.2022 11:27

@ThorJacobsen — «функции кросс-происхождения»? Знаете ли вы, что SES расшифровывается как Simple Email Service и не является службой хостинга?

— 19.12.2022 15:19

@Quentin да, но поскольку он отправляет HTML, я бы предположил, что они что-то делают, чтобы не рассылать электронные письма с вредоносным содержимым.

— 21.12.2022 07:59

html css amazon-ses

19.12.2022 11:16

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

Toor - Ангулярный шаблон для бронирования путешествий

Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...

110

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете попробовать это:

<!DOCTYPE html>
<html>

<head>
  <title>HTML Pandas Dataframe with CSS</title>
  <meta charset = "UTF-8">
  <meta name = "viewport" content = "width=device-width">
  <title></title>
  <style>
.mystyle {
  font-size: 11pt;
  font-family: Arial;
  border-collapse: collapse;
  border: 2px solid silver;
}

.mystyle td {
  padding: 5px;
}

.mystyle th {
  padding: 5px;
  background: #66bfbf;
}
  </style>
</head>

<body>

  <table>
<tr style = "color: rgb(119,119,119);font-size: 16.0px;">
  <td align = "left">
    <p> </p>
    <p>Hi,</p>
    <p>Welcome!</p>
    <br>
    <br>
  </td>
</tr>
  </table>
  <table border = "1" class = "dataframe mystyle">
<thead>
  <tr class = "mystyle" style = "text-align: right;">
    <th>id</th>
    <th>name</th>
  </tr>
</thead>
<tbody>
  <tr class = "mystyle">
    <td>1</td>
    <td>Jack</td>
  </tr>
</tbody>
  </table>
</body>

</html>

он работает именно так, как я хочу. Спасибо :)

— 19.12.2022 11:56

19.12.2022 11:24