0

ウェブサイトで使用するロゴのネオンサインと電子メールの署名を作成したいと思います。

親切な人が私を助けてくれることを望んでいるいくつかの質問があります。

  1. 電子メールの署名については、アニメーションGIFが最適だと思っていました-安全のためだけですか？ただし、htmlテンプレートを使用することはできますが、Webサイトバージョンで使用されるCSSアニメーションが（または多数の）電子メールクライアントで正しくレンダリングされるかどうかわかりませんか？

  2. マークアップで入力された文字を使用したCSSアニメーションのネオンサインのこの例を見つけました。http://www.broken-links.com/tests/animations/

これと同じCSSアニメーション手法がフラットな画像で機能するかどうか疑問に思いましたか？CSSは、文字の端がどこにあるかをどのように知るのでしょうか？この手法を使用すると、透明なpngは正しく機能しますか？それが役立つ場合、私はピクセルまたはベクトルベースの画像を持っていますか？

これは、私が作成したいネオンサインのロゴとクイックモックアップスタイルのスクリーンショットです。

前もって感謝します！

人形のロゴ

4

3 に答える 3

2

リンクした例では、テキストのみを使用しています。ルールを使用し@font-faceてカスタムフォントをロードし、フォントの色をアニメーション化します。その色はフラットです。

あなたがやろうとしていることは、かなり多くのことを含みます。最も簡単な解決策は、おそらく各文字を独自の画像に分割することです。そうすれば、opacityプロパティをアニメーション化できます。これはおそらくあなたが望むことができる最高のものです。

于 2013-03-17T13:06:43.350 に答える
1

私があなたをよく理解しているかどうかはわかりませんが、これはネオンテキストに適用されるように透明な画像にドロップシャドウを適用します。

-webkit-filter: drop-shadow(0px 0px 8px rgba(0,0,0,0.5));

filter: url(/assets/svg/shadow.svg#drop-shadow);

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='rgba(0,0,0,0.3)')";

filter: progid:DXImageTransform.Microsoft.S
于 2013-03-17T19:57:40.057 に答える
0

このリンクでは、ドロップシャドウとボックスシャドウについても詳しく説明しています。ブラウザのサポートにより、プロジェクトに必要なものではありませんが、このドロップシャドウCSSトリックを検索する他の人には役立つ可能性があります。

http://demosthenes.info/blog/598/boxshadow-property-vs-dropshadow-filter-a-complete-comparison

于 2013-03-18T00:38:06.293 に答える