XHTML+CSS CHAPTER_03 デザインパーツ

赤坂の学校へ通い始めて、楽しい仲間たちと真剣にホームページ制作を学んできました。
その中でも、基礎であるHTML,CSSのコーディングを何度も繰り返し練習しました。
参考にした本は、「XHTML+CSSプロが教える”本当の使い方”MdN編集部編」です。
この本で学んだレイアウト、ナビゲーション、デザインパーツをコーディングしたものを紹介します。

画像は、すべて本書より引用したものです。

CHAPTER 03 デザインパーツ

chapter3-01. フリーレイアウトのフローチャート
chapter3-02. 親子関係がわかるツリー表示のサイトマップ
chapter3-03. フッターをコンテンツ下部のブラウザウィンドウに固定する
chapter3-04. スペースを取ってつくる見やすいテーブル
chapter3-05. アイコンが自動的に付くユニークなリンクをつくる
chapter3-06. 表示が崩れない可能性の高い見出しをつくる
chapter3-07-01. テキストの有無によるヘッダーの組み方の違い
画像のみのヘッダー
chapter3-07-02. テキストの有無によるヘッダーの組み方の違い
テキストがあるヘッダー
chapter3-08. アナログ感のある画像を使ったサイトデザイン
chapter3-09. 画像を使わない装飾記号付きキャプション
chapter3-10. コンテンツ量の変化に適応しやすい罫線をつくる
chapter3-11. Flashをアクセントにして商品を強く印象づけるショップサイト
chapter3-12. 共用要素の派生型を使ってページ設計を効率的に行う
chapter3-13. 背景画像に凝ったツールチップを使う
chapter3-14-01. リストのマーカーを画像でアレンジする
リストのマーカー画像を置換する
chapter3-14-02. リストのマーカーを画像でアレンジする
訪問住リンクのマーカー画像を置換する
chapter3-15. 透過GIFや半透明PNGを利用した画像へのマスク効果

このページの上部へ