html - 表格基础框架中的中心 Logo

标签 html css zurb-foundation

我最近开始将基础框架与电子邮件通讯一起使用。正如我所看到的,我必须回到那些好的旧 table 上。我不明白为什么我在将 Logo 居中/对齐时遇到如此大的问题?

标志一直卡在左边,而不是中间。我在表格上设置了边框,以便于查看。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="width=device-width" />
  <title>A title</title>
  <link rel="stylesheet" href="css/foundation-emails.css" />

<style type="text/css">

</style>
</head>

<body>
  <!-- <style> -->
  <table class="body" data-made-with-foundation>
    <tr>
      <td class="float-center" align="center" valign="top" style="border: 1px solid pink">
        <center>
          <table class="container" align="center" style="border: 1px solid green">
            <tbody>
              <tr>
                <td>
                  <table class="row">
                    <tbody>
                      <tr>
                        <th class="small-12 large-12 columns first">
                          <table>
                            <tr>
                              <th>
                                <img src="https://i1.wp.com/1stwebdesigner.com/wp-content/uploads/2016/04/line-art-logo.jpg?fit=600%2C400&resize=350%2C200" style="border:1px solid red" align="center">
                              </th>
                              <th class="expander"></th>
                            </tr>
                          </table>
                        </th>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
        </center>
      </td>
    </tr>
  </table>
</body>
</html>

最佳答案

经过 2 小时的搜索,我终于在这里找到了答案:

https://foundation.zurb.com/emails/docs/alignment.html

关于html - 表格基础框架中的中心 Logo ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41841349/

相关文章:

javascript - 在 2 个不同的表中对齐行高的快速方法

html - 为页面制作页脚但某些 CSS 不起作用

html - 如何内嵌div元素?

html - 如何将页脚放在可见页面的底部?

html - 尝试使用 Zurb Foundation 使电子邮件在响应列点折叠

javascript - 防止 href ="#"链接更改 URL 哈希

javascript - 添加带有按键事件的元素

html - 博主布局问题

javascript - 如果没有内容,使 <div> 不可见

javascript - (Foundation CSS) 下拉菜单不起作用