3

父の会社のHTMLフッターを作成するのに大きな問題があります。彼らはOEとOutlook10を使用しています。私は非常に長い間コードに取り組んできましたが、それでもいくつかの問題があります。外部フォントを使用できますか？どうすれば機能させることができますか？幅X％で配置してみませんか？

私はそれをこのように見せたいです：

ここに画像の説明を入力してください

しかし、そうではありません...

コードは次のとおりです。

    <!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>www.k#$#$#$#$#$#$#$.com</title>
<style>

@font-face {
    font-family: times_Sans_Serif;
    src: url('http://a#$#$#$#$#$#$#$.pl/tem/TIMESS_.ttf');
}

p, a, span {
    font-family: times_Sans_Serif;
}

a {
    text-decoration:none;
}


.header {
    width:100%;
    height:5px;
    display:block;
    background-color:#6d5759;
}

.section li{
    float: left;
    display: inline;
    list-style-type: none;
    margin:0% 3%;
    padding:0;
    position:relative;
}

.section p{
    display:block;
    text-align: left;
    color:#6d5759;
}



.section a{
    color: #6d5759;
}

#logo {
    text-decoration:none;
    text-align: right;

}

.footer {
    clear:both;
    font-size:11px;
    width:100%;
    height:auto;
    display:block;
    background-color:#6d5759;
    color:#FFF;
    text-align:center;
    padding: 5px;
}

.footer a{
    color:#FFF;
}

</style>
</head>

<body>
<div class="main">
    <div class="header"></div>

    <ul class="section">

        <li id="osoba">
               <p>
<a href="http://k#$#$#$#$#$#$#$.com/o-nas" target="_blank">Marcjusz K#$#$#$#$#$#$#$</a><br>
                +48 500 000 000<br>
                marcjusz@k#$#$#$#$#$#$#$.com
                </p>
        </li>

        <li id="logo">
            <a href="http://k#$#$#$#$#$#$#$.com/" target="_blank"><img src="http://#$#$#$#$#$#$#$.pl/tem/image001.png"></a>
        </li>


    </ul>

    <div class="footer">
        <span> K#$#$#$#$#$#$#$ Ubezpieczenia Sp.J. &nbsp;|&nbsp; 31-475 Kraków ul. STREET1 &nbsp;|&nbsp; 32-700 Bochnia ul. STREET2 &nbsp;|&nbsp; 32-800 Brzesko ul. STREET 3 &nbsp;|&nbsp; <a href="http://k#$#$#$#$#$#$#$.com/" target="_blank">www.kr#$#$#$#$#$#$#$.com</a></span>
    </div>

</div>
</body>
</html>

それを手伝ってくれませんか。とても助かります！

4

3 に答える 3

2

スタイルシートは、ほとんどのメールクライアントではサポートされていません。一部のインラインスタイルが許可されます。メールがコンテナから逃げるのを防ぐために、ポジショニングは通常サポートされていません。Gmailメニューなどをスプーフィングしようとしているメールを想像してみてください。

一般に：

  • レイアウトにテーブルを使用する
  • インラインスタイルを使用する

サポートされているものの優れたギルドについては、以下を参照してください。

http://www.campaignmonitor.com/css/

于 2012-11-14T20:55:25.777 に答える
1

電子メールは、正しく機能させるために 10 年前の HTML をほとんど使用する必要があるという点で奇妙です。多くのクライアントは、head 内のほとんどのもの (実際の body タグを含む) を取り除きます。これには、gmail、yahoo、hotmail などが含まれます。特定のものだけが保持されます。スタイルを維持するものもありますが、すべてではありません。

スタイルを head から離し、style="" プロパティを使用してタグ内にインライン化し、テーブルを使用することをお勧めします (90 年代を思い出してください)。

したがって、次のようなものがあるかもしれません：

<table width="100%">
<tr>
  <td id="osoba" style="">..Osoba...<td>
  <td id="logo" style="">..logo..</td>
</tr>
<tr>
  <td id="footer" style="">...footer...</td>
</tr>
</table>

注: 明確にするために ID を記載していますが、ID を削除したため、それらは必要ありません。

于 2012-11-14T21:03:05.900 に答える
0

やりました！それは私が望んでいたように見えます。;) テーブルを使用してレイアウトを作成するのは精神的に苦痛でしたが、うまくいきました。;P助けてくれてありがとう！

同様の問題を抱えている人のためのコードは次のとおりです。

<html>
<head>
<meta charset="utf-8">
<title>www.#¤#¤#¤#¤#¤#¤#¤#¤#.com</title>


</head>

<body>
<table width="100%" align="center">
    <tr>
        <td colspan="4" style="width:100%; height:5px; background-color:#818285"></td>
    </tr>

    <tr style="color: #818285;" align="center">   

        <td width="20%"></td>
        <td align="right" width="24%">
                <div style="text-align:left; width:180px; right:0%; color:#818285;">

                <a style="color:#818285; text-decoration:none;" href="http://k#¤#¤#¤#¤#¤#¤#¤#¤#.com/o-nas" target="_blank">Marcjusz K#¤#¤#¤#¤#¤#¤#¤#¤#</a><br>
                +48 500 000 000<br>
                <a style="color:#818285; text-decoration:none;" href="mailto:marcjusz@k#¤#¤#¤#¤#¤#¤#¤#¤#.com">marcjusz@k#¤#¤#¤#¤#¤#¤#¤#¤#.com</a>
                </div>

        </td>    

        <td align="center" width="4%" style="font-size:2em; color:#818285;"></td>

        <td align="left" width="52%">
            <a style="color:#818285; text-decoration:none;" href="http://k#¤#¤#¤#¤#¤#¤#¤#¤#.com/" target="_blank"><img src="http://#¤#¤#¤#¤#¤#¤#¤#¤#.pl/tem/logo-poziom300.jpg"></a>
        </td>

    </tr>


    <tr><td colspan="4" style="font-size:11px; background-color:#818285; color:#FFF;    text-align:center; padding: 5px; ">
        <span> K#$#$#$#$#$#$#$# Ubezpieczenia Sp.J. &nbsp;|&nbsp; 31-475 Kraków ul. STREET 6a &nbsp;|&nbsp; 32-700 Bochnia ul. STREET 14 &nbsp;|&nbsp; 32-800 Brzesko ul. STREET 3 &nbsp;|&nbsp; <a style="color:#FFF; text-decoration:none;" href="http://k#$#$#$#$#$#$#$#$#.com/" target="_blank">www.k#$#$#$#$#$#$#$#.com</a></span>
    </td></tr>
</table>

</body>
</html>
于 2012-11-15T01:45:50.620 に答える