响应式 html 时事通讯，表格如 bootstrap

Question

我想发送响应式新闻通讯。我知道如何使用我的 style.css

<table cellpadding="0" cellspacing="0" border="0" align="center" width="600" bgcolor="#fff">

 <tbody> 
    <tr>
        <td style="padding-bottom:5px" valign="top">
            <table cellpadding="0" cellspacing="0" border="0" align="center" width="295" style="background:#ffffff">
                <tbody> 
                    <tr>
                        <td style="padding:15px;background-color:#fff">

                        image

                        </td>

                    </tr>
                </tbody>
            </table>
       </td>
       <td style="padding-bottom:5px" valign="top">
            <table cellpadding="0" cellspacing="0" border="0" align="center" width="295" style="background:#ffffff">
            <tbody>
                <tr>
                    <td style="padding:15px;background-color:#fff">
                        text
                    </td>

                </tr>
            </tbody>
        </table>
       </td>    
    </tr>   
    <tr>
        <td style="padding-bottom:5px" valign="top">
            <table cellpadding="0" cellspacing="0" border="0" align="center" width="295" style="background:#ffffff">
                <tbody>
                    <tr>    
                        <td style="padding:15px;background-color:#fff">
                            text
                        </td>

                    </tr>
                </tbody>
            </table>
        </td>

    </tr>    



 </tbody>
</table>

但是我有一个问题。

在桌面上看起来不错，

image                    text
text                     image

但在移动设备中

长相

image
text
text
image

我想要这样

image
text
image
text

我找到了 Column order manipulation using col-lg-push and col-lg-pull in Twitter Bootstrap 3，我想知道表格中是否有类似的东西。

我尝试将 align="center" 更改为 aling="left" 和 align="right"，但什么也没有。

谁能帮帮我？

Answer 1

而不是通过使用两个 table 单元格（td's）来获得并排效果，你需要 使每一面成为一个整体 table，并在 table 上使用 align 属性。这样，当电子邮件转到一栏时，您可以按任意顺序排列左侧或右侧。

Julie Ng 的 Antwort 模板对此技术有很好的描述+示例：

https://github.com/InterNations/antwort/wiki/Columns-to-Rows-%28Version-1.0%29

响应式 html 时事通讯，表格如 bootstrap

responsive html newsletter with tables like bootstrap

html

css

html-table

newsletter

twitter-bootstrap