用普通HTML表制作响应表

用普通HTML表制作响应表,html,css,html-table,html4,Html,Css,Html Table,Html4,所以 我用HTML4.01发了一封电子邮件 严格使用嵌套表 <body bgcolor="#666666"> <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" bgcolor="#666666"> <tr> <td width="600" height="60"> &

所以

我用HTML4.01发了一封电子邮件 严格使用嵌套表

<body bgcolor="#666666">
    <table width="600" cellpadding="0" cellspacing="0" border="0" align="center" bgcolor="#666666">
        <tr>
            <td width="600" height="60">
                <table width="600" cellpadding="0" cellspacing="0" border="0">
                    <tr>
                        <td width="600" height="60" align="center"><span style="font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#FFFFFF"><br>
                        Etkö näe tätä viestiä?  <a href="#" style="color: #ffffff;">Siirry HTML-versioon</a>
              </span></td>
                    </tr>
                </table>
            </td>
        </tr>


Etkönäe tätäviestiä?
比如像这样。这一文档中有800多行代码。 现在我被要求用相同的内容制作一个有响应性的单页网站

我的问题是,有没有一种简单或半简单的方法可以用HTML表生成响应页面

正如你所看到的,有很多硬编码的宽度和高度

我想用一些疯狂的css技巧跳过一些工作。 我在谷歌上搜索了一下,找到了这个,但它什么也没做,至少现在是这样。

Style 1#

我删除了每个td和tr中的所有像素和点固定大小。 这是痛苦和缓慢的,我现在宁愿使用#2

风格#2

我刚刚用引导网格重新编辑了所有内容
一旦您了解了引导网格,它将比在表中查找固定大小更快。一旦你有了模板,进行更改也会容易得多。

如果你想变得简单,你可以在css中添加类似
@media(max width:800px){table,tbody,tr{display:block}td,th{display:inline block}
的东西……哦,对不起,我刚刚注意到你源代码中的
width=“600”
。移除所有这些。固定宽度对响应性不利。另外,您的桌子只有一个td宽吗?那有什么目的?