修改 我已经将html实现为签名，但我现在遇到的问题非常奇怪。
我有一个签名，每次我将它从outlook发送到web邮件服务outlook put标签在html中并且混乱所有间距。我该如何解决这个问题。
我对Outlook签名有疑问。对于我的工作，我必须签名，以便它看起来更专业。我已经做了一个测试，看看我需要如何将它实现到签名的HTML中，但我无法弄明白。
这是Outlook生成的代码：
<style>
<!--
/* Font Definitions */
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;
mso-font-charset:0;
mso-generic-font-family:swiss;
mso-font-pitch:variable;
mso-font-signature:-520092929 1073786111 9 0 415 0;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{mso-style-unhide:no;
mso-style-qformat:yes;
mso-style-parent:"";
margin:0cm;
margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:11.0pt;
font-family:"Calibri","sans-serif";
mso-ascii-font-family:Calibri;
mso-ascii-theme-font:minor-latin;
mso-fareast-font-family:"Times New Roman";
mso-fareast-theme-font:minor-fareast;
mso-hansi-font-family:Calibri;
mso-hansi-theme-font:minor-latin;
mso-bidi-font-family:"Times New Roman";
mso-bidi-theme-font:minor-bidi;}
p.MsoAutoSig, li.MsoAutoSig, div.MsoAutoSig
{mso-style-priority:99;
mso-style-link:"E-mailhandtekening Char";
margin:0cm;
margin-bottom:.0001pt;
mso-pagination:widow-orphan;
font-size:11.0pt;
font-family:"Calibri","sans-serif";
mso-ascii-font-family:Calibri;
mso-ascii-theme-font:minor-latin;
mso-fareast-font-family:"Times New Roman";
mso-fareast-theme-font:minor-fareast;
mso-hansi-font-family:Calibri;
mso-hansi-theme-font:minor-latin;
mso-bidi-font-family:"Times New Roman";
mso-bidi-theme-font:minor-bidi;}
span.E-mailhandtekeningChar
{mso-style-name:"E-mailhandtekening Char";
mso-style-priority:99;
mso-style-unhide:no;
mso-style-locked:yes;
mso-style-link:E-mailhandtekening;}
.MsoChpDefault
{mso-style-type:export-only;
mso-default-props:yes;
mso-ascii-font-family:Calibri;
mso-ascii-theme-font:minor-latin;
mso-fareast-font-family:"Times New Roman";
mso-fareast-theme-font:minor-fareast;
mso-hansi-font-family:Calibri;
mso-hansi-theme-font:minor-latin;
mso-bidi-font-family:"Times New Roman";
mso-bidi-theme-font:minor-bidi;}
@page WordSection1
{size:595.3pt 841.9pt;
margin:70.85pt 70.85pt 70.85pt 70.85pt;
mso-header-margin:35.4pt;
mso-footer-margin:35.4pt;
mso-paper-source:0;}
div.WordSection1
{page:WordSection1;}
-->
</style>
</head>
<body lang=NL style='tab-interval:35.4pt'>
<div class=WordSection1>
<p class=MsoAutoSig><span style='mso-fareast-font-family:Calibri;mso-fareast-theme-font:
minor-latin'><o:p> </o:p></span></p>
</div>
</body>
</html>
我真的不明白我需要把代码放在哪里。 这是我的代码：
<style>
a {
text-decoration: none;
color: inherit;
}
.wrapper {
width:50%;
font-family: Calibri, Candara, Segoe, 'Segoe UI', Optima, Arial, sans-serif;
}
.topText {
font-size: 11pt;
margin-bottom: 5px;
}
.topLine {
border-top: 2px solid #C80032;
margin-bottom: 5px;
}
.content {
height:100px;
width: 100%;
margin-bottom: 5px;
}
p {
font-size:10pt;
}
.left-content {
float:left;
margin-right: 140px;
}
.right-content {
}
.name {
margin: 0px !important;
float: left;
}
.address {
margin: 0px 0px 0px 20px;
}
.address_A {
margin: 0px 0px 0px 30px;
}
.address_M {
margin: 0px 0px 0px 14px;
}
.bottomBar {
float: right;
width:74.5%;
height: 25px;
background-color:#7F7B7B;
color: white;
font-size: 12pt;
text-align: left;
margin-left: 18px;
}
.tableStyle{
margin-bottom: 5px;
}
.social-Blocks
{
background-color:white;
width: 25px !important;
height: 25px !important;
float:left;
margin-left: 15px;
text-align:center;
font-size: 23px;
color: #0987B2;
}
.bottom-bar-first{
float: left;
width:11%;
height: 25px;
background-color:#7F7B7B;
color: white;
font-size: 12pt;
}
.bottom_Span{
margin-left: 10px;
}
.suplaconLogo{
height:90px ;
width:190px;
}
.logo{
float: right;
}
</style>
<link rel="stylesheet" href="style.css"></head>
<div class="wrapper">
<div class="topText">Met vriendelijke groet,</div>
<div class="topLine"></div>
<img class="logo" src="images/logo.png" height="80" width="350">
<table class="tableStyle" cellpadding="0">
<tr>
<td><span><strong>Information</strong></span></td><td><span class="address_A"><strong>Information</strong></span></td>
</tr>
<tr>
<td><span class="name">T</span><span class="address"> Information</span></td>
<td><span class="address_A">Information</span></td>
</tr>
<tr>
<td><span class="name">M</span><span class="address_M">Information</span></td>
<td><span class="address_A">Information</span></td>
</tr>
<tr>
<td><span class="name">E</span><span class="address">Information </span></td>
<td><span class="address_A"><a href="">Information</a></span></td>
</tr>
</table>
<div class="bottomStyle">
<div class="bottom-bar-first"></div>
<div class="social-Blocks"><a href="
"><span class="icon-linkedin center" target="blank"></span></a></div>
<div class="social-Blocks"><a href="" target="blank"><span class="icon-facebook2 center"></span></a></div>
<div class="social-Blocks"><a href="" target="blank"><img src="" height="25"></a></div>
<div class="bottomBar"><span class="bottom_Span"><strong> Information</strong></span></div>
</div>
</div>
如何将我的代码包含在Outlook代码中，或者我需要将代码放在何处？我找到了这个，似乎我的CSS确实兼容：
Word 2007 HTML and CSS Rendering Capabilities in Outlook 2007
答案 0 :(得分：1)
几乎所有电子邮件客户端都不支持链接到外部样式表（当然Outlook不支持）。
因此我建议您将所有内容都放在head > style标记
答案 1 :(得分：1)
使用Outlook签名的最佳实践（即使听起来很糟糕）是在MS Word中设置签名样式并将此文本块粘贴到选项中的Outlook签名框中。
我会避免在Outlook中使用自己的自定义css。
答案 2 :(得分：0)
＆lt; div class =＆＃34; wrapper＆＃34;风格=＆＃34;宽度：50％; font-family：Calibri，Candara， Segoe，＆＃39; Segoe UI＆＃39;，Optima，Arial，sans-serif;＆＃34;＆gt;
另外，如果您能提供帮助，我建议您不要复制和粘贴Word。
答案 3 :(得分：-1)
嗯，Outlook很糟糕。它只是不支持很多CSS。无论是桌面客户端版本还是网络邮件版本，甚至是hotmail或msn邮件，您都会得到不同的结果。
此链接提供了对支持的内容的一些了解。例如，您无法在Outlook中浮动。
https://www.campaignmonitor.com/css/
您还应该使用内联样式而不是外部链接，甚至包括头部中的样式块，以便它们不会被剥离。这是一个自动执行此操作的工具。
基本上，由于缺乏CSS支持，你需要为微软愚蠢。