画像を使うことは、コンテンツを魅力的で興味深いものにするのに効果的です。ただし、画像とテキストを組み合わせると、テキストが読みづらくなることがあります。
この記事では、テキストの視認性を向上させるために、画像の上にテキストを置いて画像を暗くする方法を紹介します。
画像フィルターを使用する方法
画像ボックスの上にテキストボックスを配置します。
画像ボックスを選択し、スタイルバーの画像タブから「明るさ」を調整します。数値が低いほど暗くなります。
ボックスにRGBA値を指定する方法
画像ボックスにボックスを追加し、同じサイズにします（縦横ともに100%）。
追加したボックスの塗りでRGBA値を変更します。A（Alpha）は色の透明度を表し、0が透明で1が不透明です。
暗くする例（0, 0, 0, 0.75）
明るくする例（255, 255, 255, 0.75）
注意点
画像ボックス（親ボックス）に不透明度を設定すると、子要素にも設定が反映されます。RGBA値で透明度を指定する方法か、画像を事前に別のツールで加工してから使用してください。
透過