3

最近コーディングやHTMLメールをしていると、Yahoo! は、特定のリンクとキーワードをハイジャックし始め<span class='yshortcuts'>、テキストとリンクの色を変更する を追加しました。これにより、かなり悪いレンダリングの問題が発生する可能性があります。

その '修正' Yahoo! 提案されたものはかなり醜いです(影響を受けるすべてのリンクとキーワード内にスパンを追加します)-特に一見任意のテキストにスタイルを適用する場合、簡単な普遍的な解決策にはほど遠い.

クラスを単純にオーバーライドすることが可能かどうか、またCSSを使用してcolor属性を削除する方法があるかどうか疑問に思っています。(<style>ブロックはすべての主要な電子メール プラットフォームでサポートされているわけではありませんが、Yahoo! ではサポートされています。サポートされていないプラットフォームでは、ブロックは適切に無視されます。)

何かのようなもの <style> .yshortcuts{color:none;} </style>

私はそれcolor:none;が有効ではなく、普遍的に機能しないことを知っています.

何か案は?

4

5 に答える 5

1

掘り下げて苦労した後、これが問題を処理する最良の方法のようです(私の考えでは)。

  1. メールの上部に、このスタイル ブロックを追加します。これにより、ほとんどのブラウザの問題のほとんどが修正されます。

    <style>
    .yshortcuts{color:inherit;}
    </style>
    
  2. IE ユーザーにも喜んでもらいたいので、<a>問題を引き起こしているそれぞれの内部に、色スタイルを使用してスパンを挿入します。例えば:

    <a href="http://google.com" style="#c912dc"><span style="#c912dc">Google</span></a>
    

これにより、ほとんどすべての状況で修正されるはずです。

ファイルが既にコーディングされている場合、これを手動で行うのは面倒なので、正規表現の検索/置換を実行すると、速度が向上するはずです (ただし、マイレージは異なる場合があります... Textmate で動作します)。

探す:

(<a[^>]*style=".*color:#(\w{6}).*".*>)(.+)(</a>)

交換:

$1<span style="color:#$2;">$3</span>$4
于 2010-07-19T21:51:21.180 に答える
0

CSS のより具体的なセレクターで色をオーバーライドできます

body #content .yshortcuts{color:inherit;}
于 2010-07-15T17:03:01.050 に答える
0

あなたは試すことができます

.yshortcuts { color: auto !important }

ただし、これが何にフォールバックするかはわかりません-ブラウザーのデフォルトの色、またはカスケード内の次の色の定義。存在する他の CSS ルールに依存します。

それがうまくいかない場合は、定義済みの新しい色で上書きする必要があると思います。

于 2010-07-15T16:57:07.503 に答える
0

残念ながら、ほとんどの電子メール クライアントで信頼できるスタイルを実現するには、インライン スタイルしか方法がないことがわかりました。ヘッドで宣言されたスタイルを削除するものもあれば、独自のクラスを追加するものもあれば、ランダムな余分な要素を追加するものもありますが、すべての要素に独自のインライン スタイルを与えることで、いくつかの素晴らしいテーブルと共に、すべての主要なクライアントで一貫してレンダリングできるようになりました。 - Gmail、Outlook、Hotmail、Yahoo など

この記事は、誰がどこで何をサポートしているかを確認するのに非常に役立ちます: http://www.campaignmonitor.com/css/

于 2010-07-15T19:38:23.397 に答える
0

クロスブラウザで動作するには、css にいくつかの定義を追加して、定義の色を維持することができます。たとえば、css にこれがあるとします。

p {color: black}
a {color: blue}

.yshortcutsがタグをラップしているか、aタグ内に配置されているかはわかりませんaが、説明のために、 をラップすると仮定するaので、解決策は css を次のように変更することです。

p, p .yshortcuts {color: black}
a, .yshortcuts a {color: blue}

基本的に、colorcss で定義されているすべての場所でこれを行う必要があります (Yahoo! が任意のテキストに対してこれを行うことができると仮定します)。これは、与えられた他のソリューションほどエレガントではありませんが、IE6 で動作するはずです。

于 2010-07-15T19:05:02.963 に答える