【シングル型】ウェブデザイン ②

シングルページ制作練習

シングルページに欠かせないのは、解像度の高い写真ですね。こちらで、フリー素材サイトを紹介しています。ぜひ参考にしてください。
[無料で使える] 写真素材サイトのご紹介

写真のサイズ

基本的に1,500px以上の写真をセレクトすることをお勧めします。解像度の高い写真は、サイズも大きくなります。外出での無線wifiを使用したスマホでの環境を配慮すると、pc用デバイスとスマホ用とに画像を2パターン用意しておくことを推奨します。

シングルページ
お題:::: 四季(春夏秋冬)

日本には、「四季」があります。春夏秋冬それぞれのセクションを作り、全部で4つのセクションで構成できるように制作してみましょう。

●2018年生徒作品(1年)//「四季折々の和菓子たち」

フルスクリーンで画像を配置

フルスクリーンで画像を配置する方法は、概ね2つの方法があります。

• 背景に設定する。(background-sizeを設定する)
• img src画像を配置する。(横幅max-width＝100%設定する)