すべてのブラウザでテキストのアウトライン/ストロークを行う最良の方法は？

よく見えるテキストや、すべてのブラウザで動作するテキストにアウトライン/ストロークを適用する際に問題が発生しています。これは、Firefox、クロム、およびSafariでテキストにアウトラインを適用しながらすべてのブラウザでテキストのアウトライン/ストロークを行う最良の方法は？

<div style="font-family: Helvetica,sans-serif;color: #FFFFFF;font-size:40px;font-weight:bold;letter-spacing:-1px;text-shadow:2px 2px 0 #000,-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000;filter:DropShadow(Color=#000000, OffX=2, OffY=2);">Text Example</div>

をそして - それはいくつかのコーナーとの良好なアウトラインとアウトラインのdoesnを使用していないことを見ていません。今、私は使用していますそれはちょうど影を使用するように切り替えるので、IEで動作しません。よりよく見えるように、すべてのブラウザで動作するテキストのアウトライン/ストロークを適用するより良い方法はありますか？

出典

2012-01-18 Paul

確かに、画像を使用してください。 – BoltClock

テキストシャドーはストロークをエミュレートするためのものではありませんでしたので、注意点emptor。実際には、テキストの影が、それはあなたが望む正確な効果を生じないように、テキストにストロークを追加するものではありません

出典

2012-01-18 19:50:43

あなたは正しい方法を提案できますか？私は画像を使用できません。このテキストは動的です。 – Paul

さまざまなサイズのテキストの上にテキストを配置したり、Flashテキストの置換を試すことはできますか？（eek！）http://www.mikeindustries.com/blog/sifr。これは本当に「プライムタイムのための準備」ではありません。 –

テキストを1px大きくすると大きすぎてアウトラインとして機能しないため、試したときにテキストの上にテキストが表示されませんでした。私はまた、（視覚的に）やや良い仕事をすることができますテキスト上のテキストの複数のレイヤーを使用してみましたが、問題は、多くのレイヤーがテキストをフロントと最終的にテキストを完全にストロークするための境界線として機能する必要があるあまりにも広がり過ぎてギャップが広がります。 – Paul

使用SVG instead.Take見here

出典

2013-04-04 09:59:06

もう少し詳細を追加し、理由を説明することをお勧めします:-) – kleopatra

。しかし、1px/-1pxサイズのシャドーを使用している場合は容認されます。

あなたはそのためにJavaScriptを試すことができます.. "http://www.netzgesta.de/dev/text/#overview"

を、それはあなたを助けますかどうかを確認します。

出典

2013-05-01 12:46:54

すべてのブラウザでテキストのアウトライン/ストロークを行う最良の方法は？

答えて

関連する問題