为新手缩短HTML

我们有以下代码进入一个数据库字段，该字段的字符数受限制

<p class="Summary-heading"> Description</p>
<p> Outer: 100% Nylon</p>
<p> Body lining: 100% Polyester Micro fleece</p>
<p> Sleeve lining: 100% Polyester</p>
<p> Contrast panel jacket with piping</p>
<p> Concealed hood</p>
<p>&nbsp; </p>
<p class="Summary-heading"> Standard Decoration Area(s)</p>
<p> Front, back, chest (both sides)</p>
<p>&nbsp; </p>
<table width: 100%border="0" cellspacing="0" cellpadding="0" class="table_icons">
  <tbody>
    <tr>
      <td style="width: 32px; padding-right: 5px; vertical-align: middle;"><img alt=""src="/Portals/0/i/embroidery.png" /></td>
      <td style="width: 32px; padding-right: 5px; vertical-align: middle "><img alt=""src="/Portals/0/i/screenprint.png" /></td>
      <td style="width: 32px; padding-right: 5px; vertical-align: middle"><img alt="" src="/Portals/0/i/heatapplieddecal.png" /></td>
      <td style="width: 32px; padding-right: 5px; vertical-align: middle"><img alt="" src="/Portals/0/i/waterresistant.png" /></td>
          <td style="width: 32px; padding-right: 5px; vertical-align: middle"><img alt="" src="/Portals/0/i/windresistant.png" /></td>
        </td>
    </tr>
  </tbody>
</table>

说明
外层：100%尼龙

衣身衬里：100%聚酯微羊毛

袖子里料：100%聚酯纤维

带管道的对比板护套

隐蔽式风帽


标准装饰区

前面、后面、胸部（两侧）

---

因此，我需要缩短代码。如果您有任何建议，我们将不胜感激。

您可以使用CSS，这样您就不必为每个td提供样式。您可以使用class/id

像

.tdClass{宽度：32px；右填充：5px；垂直对齐：中间；}
以下是我对缩短它的看法，我认为它不能再压缩了。
这将进入您的样式表：

<style>

.table-icons {
    width: 100%;
    border: 0 none;
    border-spacing: 0;
    border-collapse: collapse;
}

.table-icons td {
    width: 32px;
    padding-right: 5px;
    vertical-align: middle;
    border: 0 none;
}

</style>


.表格图标{
宽度：100%；
边界：0无；
边界间距：0；
边界塌陷：塌陷；
}
.表格图标td{
宽度：32px；
右侧填充：5px；
垂直对齐：中间对齐；
边界：0无；
}

这将被输入数据库

<p class="summary-heading">Description</p>
<p>Outer: 100% Nylon</p>
<p>Body lining: 100% Polyester Micro fleece</p>
<p>Sleeve lining: 100% Polyester</p>
<p>Contrast panel jacket with piping</p>
<p>Concealed hood</p>
<p>&nbsp;</p>
<p class="summary-heading"> Standard Decoration Area(s)</p>
<p>Front, back, chest (both sides)</p>
<p>&nbsp;</p>
<table class="table-icons">
    <tr>
        <td><img src="/Portals/0/i/embroidery.png"></td>
        <td><img src="/Portals/0/i/screenprint.png"></td>
        <td><img src="/Portals/0/i/heatapplieddecal.png"></td>
        <td><img src="/Portals/0/i/waterresistant.png"></td>
        <td><img src="/Portals/0/i/windresistant.png"></td>
    </tr>
</table>

说明
外层：100%尼龙

衣身衬里：100%聚酯微羊毛

袖子里料：100%聚酯纤维

带管道的对比板护套

隐蔽式风帽


标准装饰区

前面、后面、胸部（两侧）



如果您仍然需要缩短它，那么缩短类名“表图标”和“摘要标题”也会有所帮助。
此外，您还可以删除所有格式选项卡，它们根本不是必需的。
尝试将样式移动到样式表中，这也将节省您编写代码的大量时间。应该是这样的：

<p> Outer: 100% Nylon</p>
<p> Body lining: 100% Polyester Micro fleece</p>
<p> Sleeve lining: 100% Polyester</p>
<p> Contrast panel jacket with piping</p>
<p> Concealed hood</p>
<p>&nbsp; </p>
<p class="Summary-heading"> Standard Decoration Area(s)</p>
<p> Front, back, chest (both sides)</p>
<p>&nbsp; </p>
<table class="master-table">
  <tbody>
    <tr>
      <td class="row"><img alt=""src="/Portals/0/i/embroidery.png" /></td>
      <td class="row"><img alt=""src="/Portals/0/i/screenprint.png" /></td>
      <td class="row"><img alt="" src="/Portals/0/i/heatapplieddecal.png" /></td>
      <td class="row"><img alt="" src="/Portals/0/i/waterresistant.png" /></td>
      <td class="row"><img alt="" src="/Portals/0/i/windresistant.png" /></td>
    </tr>
  </tbody>
</table>

查看有关末端标签的新规范。在HTML5中，许多元素在某些情况下不需要结束标记

使用外部css文件。将同一样式代码重复多次。即使您想让用户自定义一些html输入，或者您想自定义博客中的帖子，也始终建议在css中定义标准，例如：

.standardt{…}
您甚至可以定义此版本的多个版本，并让用户在其代码中选择一个版本

您还可以为一个表创建一个完整的类，这样您只需向表中添加一个类，从此类开始，您就可以设计表的所有内容

.myTable td{width:32px；padding right:5px；垂直对齐：middle；}

用户只需将此类添加到他的
-标记中。提供以下要素：

.left、.right、.vcenter、.center

对于标准文本对齐。这样可以节省额外的长度。此外，这有助于在支持自定义的同时创建统一的外观

在数据库中使用压缩，例如gzip

您甚至可以使用html压缩/缩小工具。但是，只有在以后不想更改此代码时，才建议您这样做。（使其难以阅读）。你甚至可以设置一个系统来自动完成这项工作，但这有点先进

td采用内联样式。。给他们一个类，并将规则移动到样式表中，这样就可以节省大量的代码。1.使用类似gz的压缩来减小大小。决定使用html或xhtml；2.验证3.使用CSS通常你不在数据库中保存HTML代码，而是保存“设置”，然后在需要时根据这些设置动态生成HTML。很抱歉，这太荒谬了。您显然不知道自己在做什么，代码非常糟糕（
在一个空的p中？使用标题作为标题），您希望它更短吗？我甚至会在摘要标题和后续段落周围加上包装纸，使其更长。从编写合适的代码开始，然后向我们寻求格式化帮助。比如.tdClass{width:32px；padding right:5px；vertical align:middle；}Do和.tableClass td{}
<p> Outer: 100% Nylon</p>
<p> Body lining: 100% Polyester Micro fleece</p>
<p> Sleeve lining: 100% Polyester</p>
<p> Contrast panel jacket with piping</p>
<p> Concealed hood</p>
<p>&nbsp; </p>
<p class="Summary-heading"> Standard Decoration Area(s)</p>
<p> Front, back, chest (both sides)</p>
<p>&nbsp; </p>
<table class="master-table">
  <tbody>
    <tr>
      <td class="row"><img alt=""src="/Portals/0/i/embroidery.png" /></td>
      <td class="row"><img alt=""src="/Portals/0/i/screenprint.png" /></td>
      <td class="row"><img alt="" src="/Portals/0/i/heatapplieddecal.png" /></td>
      <td class="row"><img alt="" src="/Portals/0/i/waterresistant.png" /></td>
      <td class="row"><img alt="" src="/Portals/0/i/windresistant.png" /></td>
    </tr>
  </tbody>
</table>

.master-table{
width: 100%;
border="0"; 
cellspacing="0"; 
cellpadding="0";
}

.row{
width: 32px; 
padding-right: 5px; 
vertical-align: middle;
}