画像の上の文字を目立たせる方法｜【Web制作解説】｜日曜エンジニアのプログラミング

Webページで「画像と文字を重ねると文字が目立たない　(^_^;)　」

そんな時は、

目立つ文字を表示する方法

CSSで「text-shadow」を使いましょう。

ボヤケていた文字がくっきりしました。

color: white;
text-shadow:
2px 2px 5px black,
-2px 2px 5px black,
2px -2px 5px black,
-2px -2px 5px black;

text-shadow:(右距離) (下距離) (ぼかし具合) (影の色);

上下左右の4方向の輪郭を指定するには、それぞれをカンマで区切って指定する。

（右距離）にマイナス　＝　左方向への影になります。

（下距離）にマイナス　＝　上方向への影になります。

・文字に輪郭をつけると、画像に埋もれず目立つ。

・CSSのtext-shadowで4方向に指定。

以上です。

記事を読んでくださりありがとうございました。

この記事が参考になった、おもしろかったという方は、広告をクリックしていただけると励みになります。

これからもよろしくお願い致します。