Webページの表の横スクロール

Webページ（ホームページ）を作る人向けの内容です。
以前弊教室の講座を受けてくださった方のWebページづくりを手伝ったときに出くわした内容からひとつ。

Webページで表を作ると、横に長くなってページの幅からはみ出してしまうことがあります。
横幅の狭い画面（例えばスマホやタブレットのような）で見ると、そのままでははみ出した部分は見ることができません。
（例）というか、この例では普通にパソコンで見ても横にはみ出しているんですけどね・・・

入浴剤

ゼラニウム

ウクレレ（ケース付き）

そこでその回避策として、横にスクロールできるようにするとスマートです。
（例）表の部分を横にスクロールしてみましょう。右にはみ出していたウクレレが見えますよね？

入浴剤

ゼラニウム

ウクレレ（ケース付き）

やり方としては、HTMLとCSSを使います。
今の時代、Webページを直接すべてHTMLで書いている素人さんはほぼ皆無でしょう。
WordPress、Jimdo、Wixなどのサービスを使っていると思います。
それらのサービス内でHTMLで編集できるツールを使ってください。

例えばWordPressでしたらテキスト編集モードにすると良いです。

以上のような感じで。

ご参考まで。

↓応援クリックしていただけると、はげみになります！！

コメント