2020/7/3 記事を更新しました。
Q.トップページのヒーローヘッダー設定で、画像スライダー上の文字に影をつけたいのですが、どうしたらよいでしょうか?
A.下記の方法でご対応ください。
カスタムCSSに下記のコードを記述いただくと、text-shadowを有効にすることができます。
.p-index-slider__item-desc{ color:inherit; text-shadow:15px 15px 10px red !important; } .p-index-slider__item-title{ color:inherit; text-shadow:15px 15px 10px red !important; }
※ただし、仕様上、上記の効果を追加することでアニメーションのブラー表現(すりガラスの様なぼかし効果)が外れます。ご了承ください。
上記内容が反映されない場合は以下の記述を加えてください。
@keyframes sliderContentAnimation1 { from { opacity: 0; color: #fff; text-shadow: 15px 15px 10px red; } to { opacity: 1; color: #fff; text-shadow: 15px 15px 10px red; } }
この記事は役に立ちましたか?
もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!