だから私はこれが可能かどうか疑問に思っています。背景として使用される小さなタイル可能なテクスチャがあるこのコンセプトがあります。x と y の両方で繰り返すように設定されていますか。
私の Photoshop のデザインでは、100% の透明度から灰色がかった色で約 40% の透明度までのシャドウ レイヤーを一番上に追加しました。背景画像と一緒に影のイリュージョンを与えます。今、影レイヤーをPNGとして保存しようとしましたが、PNGファイルを巨大にするPNG-24として保存する必要があるようです。
それで、これはまったく可能ですか？つまり、xml または xaml を使用すると、これは簡単になります。四角形を挿入して、上が 0%、下が 40% のグラデーションを追加し、色は黒か何かにします。素敵なフェード効果を与えてくれます。しかし、これは HTML と CSS では不可能ですか?
通常、説明を正しく理解していれば、通常の背景で行うのと同じように、ドロップシャドウを繰り返すという同じ概念を適用できます。
ドロップシャドウを幅 1 ピクセル、グラデーション自体の高さ全体にスライスするだけです。次に、X 軸にドロップシャドウを付けて png 画像を繰り返します (css: background-repeat: repeat-x;)
お役に立てれば。碧玉
例がないとアドバイスするのは少し難しいです。コメントの 1 つで、「最初は影を中央に向かって少し変化させたかった」と言っていますが、これは現在、幅が 1500 奇数ピクセルの画像を持っているということですか?
一般的には、可能な限り画像を繰り返す方が良いため、幅が 1 ピクセルで全体に繰り返される画像 (これは非常に広い画面にも適しています) を作成してから、背景位置が設定された別の「レイヤー」に別の画像を作成することができます。真ん中に。
グラデーションの高さが 256px 以下の場合は、色の数を減らすこともできます。また、PNG ファイルのサイズを縮小するための優れたツールであるPNGcrushもお試しください。
よく理解できたかどうかはわかりませんが、マイクロソフトの強力なフィルターについて聞いたかどうかはわかりませんが、とりわけ美しいグラデーションを作成できます。
グラデーションを作成する CSS にこのコードを貼り付けると、結果が表示されます。
filter:progid:DXImageTransform.Microsoft.Gradient (GradientType=1, StartColorStr='#000000', EndColorStr='#0000FF')
フルスクリーンが必要な場合は、これを body タグに適用します。これを div に適用する場合は、div に適用します。固定の高さを設定する必要があるか、高さに自動調整されるかは覚えていません。
ただし、Microsoft からのものであるため、IE でのみ機能します :-(.
これが役立つことを願っています。
セザール。