【发布时间】：2021-09-12 11:11:18
【问题描述】：
我为自己成功地为客户制作了我想要的自定义网格感到非常自豪，但后来我被告知它也需要用于电子邮件。尝试寻找不同的显示替代方案：网络上的网格，但找不到。
是否存在这样的替代方案？如果没有，有什么建议？
这里是我制作的网格供参考：
<!DOCTYPE html>
<html>
<head>
<style>
.wrapper {
display: grid;
grid-template-columns: repeat(20, 1fr);
gap: 10px;
grid-auto-rows: minmax(30px, auto);
}
.one {
grid-column: 1 / 16;
grid-row: 1 / 9;
background-color: black;
}
.two {
grid-column: 16 / 21;
grid-row: 1 / 9;
background-color: red;
}
.three {
grid-column: 1/7;
grid-row: 9 / 12;
background-color: green;
}
.four {
grid-column: 15/21;
grid-row: 9/12;
background-color: blue;
}
.five {
grid-column: 1/11;
grid-row: 12/17;
background-color: yellow;
}
.six {
grid-column: 11/21;
grid-row: 12/17;
background-color: purple;
}
.seven {
grid-column: 7/15;
grid-row: 9/12;
background-color: gray;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="one">One</div>
<div class="two">Two</div>
<div class="three">Three</div>
<div class="four">Four</div>
<div class="five">Five</div>
<div class="six">Six</div>
<div class="seven">text</div>
</div>
</body>
</html>【问题讨论】：
标签： html css gmail css-grid html-email