1-1:準備
基本用語
ドメインの取得
スペースの確保
デザインを考える
SEOを考える
2-1:HTMLの記述
htmlファイルの作り方
HTMLの基本骨格
HTMLの種類、META、言語
タイトルと著作権情報
文の構成を考える
画像の表示
リンクの設定
2-2:CSSの記述
CSSのHTMLへの組み込み
クラスの概念
文字の色とフォント
幅と高さの設定
文章の設定
文字の間隔・線
背景色・背景画像
2-3:CGI/アップロード
掲示板(BBS)の設置
カウンターの設置
サーバーへのアップロード
アクセス解析の導入
3:divでのレイアウト
divタグの使い方(前編)
リストの設定
divタグの使い方(後編)
インライン要素とブロック要素
floatの使い方
スクロールボックスの作成
アンカー(a)のスタイルの変更
4:tableでのレイアウト
Tableの構造を知る
Tableスタイルの変更
Tableでサイトを作る(前編)
Tableでサイトを作る(後編)
5:positionでのレイアウト
positionの構造を知る
HTMLファイル(原本)作成
positionで位置を決める
6:その他のテクニック
強調タグを使う
サムネイルの作成
三次元化する
スクロールバーの色を変える
7:Javascriptを使用する
プルダウンメニュー
(フォーム使用)の作成
プルダウンメニュー
(CSS使用)の作成
>>ホームページの作り方TOP >>三次元化する
z-indexを使えば、ボックスを三次元的に扱うことが可能になり、重ね合わせることができます。
positionを使用したレイアウトをする場合、ボックス同士が重なり合わないようにするために使用します。
.a1 { position:absolute; left:0; top:0; z-index:2; } |
通常positionと使うことが多く、要素の数値(上の例なら2)が大きくなるほど手前に表示されます。