Question

我创建了这个需要在Outlook中使用的电子邮件签名模板。它在浏览器中看起来很棒，但Outlook完全搞砸了它。我不确定我缺少什么

这是我正在使用的确切文件：

<!DOCTYPE html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <style>
.sContainer {
    border: solid 1px black;
    widows: 200px;
    width: 350px;
    font-family: Verdana,Arial,sans-serif;
    font-size: 8pt;
    color: #000;
    background-color: #FFF;
    margin: 0px;
    padding: 0px;
    padding-left: 10px;
    display: block;
    overflow: auto;
}

.sHeader {
    padding: 0;
    margin-right: 15px;
    margin-bottom: 5px;
    border-bottom: solid #FFC300 2px;
}
.sHeader .name {
    font-size: 14pt;
}
.linebreak{
    color: yellow;
}
.sBody{
    width:100%;
}
.sLogo{
    width: 160px;
    height: 160px;
    float: left;
}
.sContent{
    padding-left: 15px;
    float: left;
}
.name,.position{
    margin: 0;
    padding: 5px 0;
}

.sContent a {
    text-decoration: none !important;
    color: #000 !important;
}

.sContent p {
    padding: 0;
    margin: 0;
    margin-bottom: 15px;
}
.highlight{
    color:#FFC300;
}

.sLogo img{
  max-width:100%;
  height:auto;
}

        </style>
    </head>
    <body>
        <div class="sContainer">
            <div class="sHeader">
                <p class="name">FULL NAME</p>
                <p class="position">POSITION | POSITION (FR)</p>
            </div>
            <div class="sBody">
                <div class="sLogo">
                    <img src="http://bgdistribution.ca/wp-content/themes/bgdistribution/images/logo.png" alt="logo"/>
                </div>
                <div class="sContent">  
                    <a class="sEmail" href="mailto:EMAILADDRESS"><p>EMAIL ADDRESS</p></a>
                    <p class="sCell">C:(514) XXX-XXXX</p>
                    <p class="sTelephone">T:(514) XXX-XXXX</p>  
                    <a href="www.bgdistribution.ca" class="sUrl"><p>www.<span class="highlight">bgdistribution</span>.ca</p></a>
                </div>
            </div>
        </div>
    </body>
</html>

JSFiddle：http://jsfiddle.net/Luz4u/

Answer 1

Outlook不支持样式表。所有样式都必须内联声明，即使这样，样式也是有限的。

请参阅：http://www.campaignmonitor.com/css/

Answer 2

使用word创建签名。另存为HTML，删除该词添加的html代码并使用此模板。它会起作用，我已经完成了这个

为Outlook设计电子邮件签名

2 个答案: