※本書の販売は終了いたしました。本書の改訂版である「よくわかるHTML5+CSS3の教科書【第3版】」を販売しておりますので、こちらをご利用下さい。
関連サイト
本書の関連ページが用意されています。
内容紹介
楽しみながら学べる”HTMLとCSSの入門書です。いま現在の、このタイミングで学びはじめるわけですから、最新バージョンのHTML5とCSS3をベースとした内容となっています。また、この第2版では、本書をテキストにして講義をおこなう先生方の事前準備の時間をできるだけ短縮できるように、サンプルファイルなどに大幅な改良を加えてあります。
まず、読者が“楽しみながら学べる”ということを実現するために、本書の全体的な構成は一般的なHTMLとCSSの入門書とは大きく変えてあります。
先にHTMLを学習してからそれを前提としてCSSを学ぶ、という流れにしてしまうと、前半はHTMLのタグを覚えていくだけの退屈な内容になってしまうからです。学習を開始した早々、眠くなるような説明が延々と続いたのでは、頑張ろうとする意欲も消え失せてしまうかもしれません。
そこで本書では、HTMLをひととおり学習してからCSSへと進むという一般的な構成をやめ、HTMLとCSSを少しずつ同時進行させる構成にしてあります。このような進め方にすると、覚えた内容をすぐにブラウザでの表示結果として確認できるため、少しずつできるようになっていく感覚を積み重ねながら、退屈せずに学習を進めることができます。
本書を、これからHTMLとCSSを覚える人が“楽しみながら学ぶ”ための入門書としてご活用いただけましたら幸いです。
(「まえがき」より編集)
【第1版からの変更点】
- 第1版は、2012年7月段階の情報に基づき執筆されました。第2版では、2014年3月段階での情報に基づいて執筆しています。
- 解説している項目自体には変更はありませんが、仕様の変化に応じて、解説やコードを追加・変更・削除しています。
- ただし、本書の解説の範囲から外れている仕様の内容については説明がないものもあります。
- そのほか、ブラウザの対応状況に合わせて説明やコードを修正し、ベンダープレフィックスも修正しています。
- また、サンプルファイルについては、完成形のほか、実際に作業しながら学びたい人のために、説明部分が未入力になっている実習用ファイルを用意しました。
書誌情報
- 著者: 大藤 幹
- ページ数: 338ページ(A4PDF版換算)
- 対応フォーマット: PDF
- 出版社: マイナビ出版
対象読者
著者について
大藤 幹
札幌在住。大学卒業後、複数のソフトハウスに勤務し、CADアプリケーション・航空関連システム・医療関連システム・マルチメディアタイトルなどの開発に携わる。1996年よりWebの基本技術に関する書籍の執筆を開始し、2000年に独立。その後、ウェブコンテンツJIS(JIS X 8341-3)ワーキング・グループ主査、情報通信アクセス協議会・ウェブアクセシビリティ作業部会委員、ウェブデザイン技能検定特別委員などを務める。現在の主な業務は、Webデザインに関連する書籍の執筆のほか、全国各地でのセミナー講師など。
著書は『Webプロフェッショナルのための黄金則 XHTML+CSS虎の巻』『世界の「最先端」事例に学ぶCSSベスト・プラクティス』『世界の「最先端」事例に学ぶ CSSプロフェッショナル・スタイル』『基本からしっかりわかるWordPress 3.x カスタマイズブック』(マイナビ)、『詳解 逆引きHTML+CSS辞典』『詳解HTML&XHTML&CSS辞典』( 秀和システム)、『10日でおぼえる CSS/CSS3入門教室』( 翔泳社)、『XHTML+CSS 超高速コーディング術』(ソシム)、『Web標準テキスト(3) HTML/XHTML』(技術評論社)など多数。
目次
Chapter 1 はじめる準備
- Lecture 1-1 インターネットとサーバーについて
- Lecture 1-2 本書で使用するソフトウェアについて
Chapter 2 オリエンテーション
- Lecture 2-1 HTMLの役割、CSSの役割
- Lecture 2-2 HTMLのタグをつけてみよう!
- Lecture 2-3 CSSを使ってみよう!
Chapter 3 文法的なカタい話
- Lecture 3-1 HTMLのタグを正しくつける意味
- Lecture 3-2 HTMLの基礎知識
- Lecture 3-3 HTMLのバージョンについて
- Lecture 3-4 CSSの基礎知識
- Lecture 3-5 CSSのバージョンについて
- COLUMN 大文字と小文字の区別
Chapter 4 ページ全体の枠組み
- Lecture 4-1 HTMLの全体構造
- Lecture 4-2 CSSの組み込み方
- Lecture 4-3 グローバル属性
- Lecture 4-4 背景を指定する(1)
- COLUMN HTML4.01とXHTML1.0 のDOCTYPE 宣言
- COLUMN CSSファイルの文字コードの指定方法
- COLUMN CSSの中にさらに別のCSSを読み込む
- COLUMN 背景画像のURL について
Chapter 5 テキスト
- Lecture 5-1 テキスト関連の要素
- Lecture 5-2 色の指定方法
- Lecture 5-3 テキスト関連のプロパティ
- COLUMN ページ内の特定の場所にリンクする
- COLUMN 値の継承について
Chapter 6 CSSの適用先の指定方法
- Lecture 6-1 よく使う主要なセレクタ
- Lecture 6-2 その他のセレクタ
- Lecture 6-3 セレクタの組み合せ方
- Lecture 6-4 指定が競合した場合の優先順位
- COLUMN 「!important」はユーザースタイルシートでも使用できる
Chapter 7 ページ内の構造
- Lecture 7-1 基本構造を示す要素
- Lecture 7-2 画像・動画・音声関連要素
- Lecture 7-3 ボックス関連プロパティ
- Lecture 7-4 背景を指定する(2)
- Lecture 7-5 配置方法を指定するプロパティ
- COLUMN HTML5の新要素を古いIE に認識させる方法
- COLUMN widthとheightの発音
- COLUMN Firefox 3.6以前に対応させる際の注意
- COLUMN 数値が0 のときは単位を省略できる
- COLUMN 絶対配置による段組み
- COLUMN 文字コードを指定しているのに文字化けする!?
Chapter 8 ナビゲーション
- Lecture 8-1 ナビゲーションに関連する要素
- Lecture 8-2 リスト関連のプロパティ
- Lecture 8-3 表示形式を変えるプロパティ
- Lecture 8-4 ナビゲーションの作り方
- COLUMN dl要素はもともとは「定義リスト」だった!?
- COLUMN 行頭記号を画像にすると位置がずれる!?
Chapter 9 フォームとテーブル
- Lecture 9-1 フォーム関連の要素
- Lecture 9-2 フォーム関連のプロパティ
- Lecture 9-3 テーブル関連の要素
- Lecture 9-4 テーブル関連のプロパティ
- COLUMN 仕様上はもっと多くの部品が用意されている!?
- COLUMN textarea 要素にbox-shadowプロパティが適用されない現象
Chapter 10 その他の機能とテクニック
- Lecture 10-1 その他の要素
- Lecture 10-2 その他のプロパティ
- Lecture 10-3 clearfixについて
- Lecture 10-4 メディアクエリー
Chapter 11 変形とアニメーション
- Lecture 11-1 トランスフォーム関連プロパティ
- Lecture 11-2 トランジション関連プロパティ
- Lecture 11-3 アニメーション関連プロパティ
Chapter 12 ページをまるごと作ってみよう
- Practice 12-1 サンプルページの概要を理解する
- Practice 12-2 まずはマークアップから
- Practice 12-3 ページ全体の初期設定と枠組みをつくる
- Practice 12-4 ナビゲーションとヘッダー
- Practice 12-5 サイドバーとフッター
- Practice 12-6 IE6対応へのヒント