スタイルシートデザインガイド

サイトマップ

スタイルシートとＨＴＭＬの基礎

スタイルシートとは
スタイルシートでホームページを作成するメリット
ＨＴＭＬファイルの中のstyle要素にまとめて記述する
独立したスタイルシートファイルにまとめて記述する
ＨＴＭＬタグの中にstyle属性を使って直接記述する

CSSレイアウト

３段組みレイアウトを簡単に実現しよう
CSSレイアウトをコントロールしよう
フッターを下部に固定して表示させる

メニュー作成

リストを使ったテーブル風レイアウト
リストで横並びのメニューを作ろう
疑似クラスを使い見栄えの良いリンク表現

見出し

グラデーション効果で読まれる見出しをつくろう
画像を使用せずに見出しを装飾しよう
グラフィックを使用せずに見出し文字を表現する

メインコンテンツ

テキストの囲みをデザインしよう
蛍光ペン効果で文字や文章を強調する

フォーム

テーブルレスなフォームのマークアップ

テーブルオブジェクト

テーブルに立体感を演出して見栄えをよくしよう
増減可能な角丸ボックスを作成する
横線だけで構成する表組みをデザインする
１行おきに色を変えた表をつくる

画像

画像の枠を額縁風にデザインする
透過ＰＮＧで画像にハイライトやフレームをつける

CSSルール

• スタイルシートの基礎
• CSSレイアウト

CSSデザイン

• メニュー作成
• 見出し
• メインコンテンツ
• フォーム
• テーブルオブジェクト
• 画像

RSS

• 
• 
• 
• 
•