1

私は電子メールキャンペーンを設計していますが、私の要件ではCSSは必要ありません。私にそれを始めさせないでください。

以下の表を除いて、すべて正常に動作しています。コーナーピースはテーブルの残りの部分から1ピクセルオフセットされており、セミコロンの位置が間違っているかどうかを一生理解することはできません。

コーナーピースは同じ15x15の画像で、コーナーに応じて90度回転しただけです。ただし、線が端まで伸びていることがわかります。そのため、画像に余分なパディングはありません。

コーナー、3200％のようにズーム

私は<t*属性を減らしてさまざまな反復を試し、テーブル、行、セルのレベルで設定しました。オンライン検索の99％で、スパンが正しく機能していることを確認するためのQ＆Aが表示されています。それは。border = 1属性を使用すると、境界線が原因であると疑われないようになりますが、キャップはまだ残っています。

私は4列x3行を使用しており、最も外側の列と行には15px X 15pxのコーナー画像（gif）が格納されており、コーナー間のセルの背景は白で、1px X1pxのgifスペーサーが配置されて引き伸ばされています。コーナー画像間の線。

中央のセクションはアイコン付きのセルで、その後にテキストのセルが続きます。これらの箇条書きを5つ作成する必要があります。これらの2つが互いに突き合わされたときに何が起こるかを示すために、2番目の空白のボックスを追加しました。

誰かが私が見ることができるもの、私が追加する必要があるもの、または私のコードから何を差し引く必要があるかについて何かアイデアがありますか？

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

<html>
 <body style='background:f3f7f8'>
     <table border=0 width=430 style='font-size=12px;cellpadding=0;cellspacing=0;border-collapse:collapse;'>
       <tr>
        <td width=15 height=15><img src="644810_tl.png" width=15 height=15 ></td>
        <td colspan=2 valign="top" style='background:ffffff'><img src="dkgray.gif" width=400 height=2></td>
        <td width=15 height=15><img src="644810_tr.png" width=15 height=15></td>  
       </tr>

       <tr>
        <td style='background=ffffff' align=left><img src="dkgray.gif" width=2 height=100></td>
        <td style='background=ffffff' width=75 align=center valign=center><img src="icon-pdf.gif"></td>
        <td style='background=ffffff' width=325 align=left valign=cener><strong>Lorem Ipsum<br></strong>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dignissim risus at quam hendrerit aliquet. Nunc et felis elit. Fusce pharetra adipiscing velit vel pharetra. Donec ornare velit sed massa tempor at tempor sem lacinia. Quisque enim nisl, auctor sit amet volutpat eget, porttitor sit amet tortor. Nulla ut sodales magna. Morbi adipiscing est urna, ac gravida erat.</td>
        <td style='background=ffffff' align=right><img src="dkgray.gif" width=2 height=100></td>
       </tr>

       <tr>
        <td width=15 height=15 style='background=ffffff'><img src="644810_bl.png" width=15 height=15></td>
        <td colspan=2 valign="bottom" style='background:ffffff;cellpadding=0;cellspacing=0;border-collapse:collapse'><img src="dkgray.gif" width=400 height=2></td>
        <td width=15 height=15 style='background=ffffff'><img src="644810_br.png" width=15 height=15></td>
       </tr>

       <tr>
        <td width=15 height=15><img src="644810_tl.png" width=15 height=15 ></td>
        <td colspan=2 valign="top" style='background:ffffff'><img src="dkgray.gif" width=400 height=2></td>
        <td width=15 height=15><img src="644810_tr.png" width=15 height=15></td>  
       </tr>

       <tr>
        <td width=15 height=15 style='background=ffffff'><img src="644810_bl.png" width=15 height=15></td>
        <td colspan=2 valign="bottom" style='background:ffffff;cellpadding=0;cellspacing=0;border-collapse:collapse'><img src="dkgray.gif" width=400 height=2></td>
        <td width=15 height=15 style='background=ffffff'><img src="644810_br.png" width=15 height=15></td>
       </tr>
     </table>
   </body>
  </html>
4

2 に答える 2

6

境界線の折りたたみを使用します。これにより、セルの境界線が1つの境界線に折りたたまれます。

table
{
    border-collapse:collapse;
}
于 2012-07-10T18:27:58.610 に答える
4

あなたはそれらがCSSプロパティであるかのように指定cellpaddingしています。cellspacingそれらはそうではありません-それらはtableタグ上に存在しなければならない属性です。

また、HEXカラーリファレンスの#前にある必要があります。

于 2012-07-10T18:30:11.543 に答える