みっつめ

作業6時間。
おはようからおやすみまで

エラーさんを参考に。
error403.net

一枚のページでいいな!シンプルでいいな!
と思ったので。

  • エラーさんのところはクリックするとヌルヌル動きますが、それはjavascriptなのでパス、でもリンクはid指定で可能
  • インライン要素をブロック要素にして、position:abusoluteで画面内の指定場所に配置、というのが目立ちました

画像の大きさや多少のmargin,paddingを除いて、主な要素の配置を画面の大きさを基準にしてるようで、pxではなく%が単位になっています。
左上の番号画像は、構造的には真ん中にある大きな画像より下に記述されていますが、CSSで左上に設置しています。
また、最初のページは

div#scene01{
top:0px;
left:0px;
}

という配置ですが、2ページ目以降はこのようになります。

div#scene02{
top:0;
left:100%;
}

div#scene03{
top:0;
left:200%;
}

下部ナビは position:fixed ですね。
なんだかプレゼンテーションみたいです。

本当はこういうところからやりたいんですけど、まだ力量不足ですね。
Nothing found for How-to-design-a-website-in-photoshop