在Outlook签名中包含所有者html和css

guicsvcw  于 2023-02-14  发布在  其他
关注(0)|答案(5)|浏览(121)

EDIT我已经实现了html作为一个签名,但问题我现在有非常奇怪。

我有一个签名,每次我把它从outlook发送到一个网络邮件服务outlook把标签在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>&nbsp;</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

yxyvkwin

yxyvkwin1#

链接到一个外部样式表是不支持几乎所有的电子邮件客户端(当然Outlook不支持它)。
所以我建议您将所有内容都放在head > style标记中

toe95027

toe950272#

我对Outlook签名的最佳做法(即使听起来很恶心)是在MS Word中设置签名的样式,并将此文本块粘贴到选项中的Outlook签名框中。
我会避免在Outlook中使用自己的自定义CSS。

qq24tv8q

qq24tv8q3#

1.把你所有的样式内联,这应该可以解决你的大部分问题,例如:

ffvjumwh

ffvjumwh4#

想象一下,到了2023年,微软365 / Office 365 Outlook仍然没有对HTML/CSS的任何支持,看到像微软这样的公司不能给予这个伟大的更新,真的很难过。

eblbsuwk

eblbsuwk5#

好吧,Outlook糟透了。它就是不支持很多CSS。而且无论是桌面客户端还是网络邮件版本,甚至是hotmail或msn邮件,你都会得到不同的结果。
此链接提供了一些有关支持/不支持的内容的信息。例如,您不能在Outlook中浮动。
https://www.campaignmonitor.com/css/
你也应该使用内联样式,而不是外部链接,甚至在头部包含一个样式块,这样它们就不会被剥离。这里有一个工具可以自动做到这一点。
http://inliner.cm/
基本上,由于缺乏CSS支持,您需要为Microsoft简化它。

相关问题