神戸ホームページ制作プロ公式ブログ

画像に文字を重ねるcss

画像に文字を表示する方法としては、フォトショップなどのソフトを使う方法がありますが、cssを使って文字を表示させることもできます。そうすればcssの編集だけで文字を変更できますので、非常に便利です。


1.画像と文字を1つのdiv要素の中に入れます


2.cssを記述します

  • 白を指定していますが、画像とのバランスを考慮して色を変えてください。
  • top には画像の上からの位置を指定してください。
  • left には画像の左からの位置を指定してください。
  • font-weight で文字の太さを指定できます。
  • font-size で文字のサイズを指定できます。
ページ上部へ戻る