『現場のプロから学ぶXHTML+CSS』正誤表

初版の修正点

章 ページ 場所 誤 正
2 66 表内「ボーダー」 border-bottom. border-left border-bottom, border-left

「.」でなく「,」
5 173 「div#container」に簡易的な「clearfix」を適用のサンプルソース部分 * html .clearfix { * html #container {
6 176 div要素の構造図   div#section-lv2#topics、div#section-lv2#cool-players、div#section-lv2#special-contents内の最後に出てくるdiv.section-lv3に「.last-child」を追記
6 190 最下部の図   図版が上下逆
6 197 本文 下のほう 作業を進めると（Web制作に便利な... 作業を進めるとよいでしょう（Web制作に便利な...
6 197 右下の図版のキャプション アドオン（拡張機能）機能が存在します。 アドオン（拡張機能）が存在します。
6 200 Firefox 2用ハック セレクタ, x:moz-read-only { ...Firefox 2 に対するスタイル... } セレクタ, x:-moz-read-only { ...Firefox 2 に対するスタイル... }

※ 「moz」の前のハイフン抜け
6 201 Opera 9.50以降用ハック
下から2行目		 セレクタ, x:moz-read-only { ... 正規のスタイル... } セレクタ, x:-moz-read-only { ...正規のスタイル... }

※ 「moz」の前のハイフン抜け
7 241 表「PSPブラウザの仕様」 Flash Player 6(6.0.72.27)
Flash Player 9(システムソフトウェアのバージョン2.50)		 Flash Player 6(6.0.72.27)
8 261 欄外 ライブラリの読み方 ライセンスの読み方

2刷での修正点

章 ページ 場所 誤 正
3 100 真ん中あたり ブラウザのデフォルトのフォントを適用してしまう問題があります。 ソースコードの書き方によっては、ブラウザのデフォルトのフォントを適用してしまう問題があります。
4 141 最後のセレクタ ul#nav li a:hover,
ul#nav li.current {
background-image: none!important;
}		 ul#nav li a:hover,
ul#nav li.current a {
background-image: none!important;
}
7 225 1行目 @mediaでメディアタイプを指定 @importでメディアタイプを指定
7 225 3行目 @importでメディアタイプを指定 @mediaでメディアタイプを指定
7 230 13行目 改ページ位置を指定するやためのpage-break-beforeプロパティ（要素の直後で改ページ）とbage-break-afterプロパティ（要素の直前で改ページ）が利用できます。 改ページ位置を指定するやためのpage-break-beforeプロパティ（要素の直前で改ページ）とpage-break-afterプロパティ（要素の直後で改ページ）が利用できます。
8 262 jQueryのライセンス ライセンスは「MITライセンス」です。 「MITライセンス」と「GPL」のデュアルライセンス（どちらかを選んで利用できる形態）です。
8 273 最初のコード $(function(){$(".tab li:first-child").addClass("selected");$(".panel li:not(:first)").css("display","none");$(".tab li").click(function(){$(".tab li").removeClass("selected");$(this).addClass("selected");$(".panel li").css("display","none");$(".panel li:eq("+$(".tabli").index(this)+")").css("display","block");});}); $(function(){$(".tab li:first-child").addClass("selected");$(".panel li:not(:first-child)").css("display","none");$(".tab li").click(function(){$(".tab li").removeClass("selected");$(this).addClass("selected");$(".panel li").css("display","none");$(".panel li:eq("+$(".tabli").index(this)+")").css("display","block");});});
8 273 3個目のコード $(".panel li:not(:first)").css("display","none"); $(".panel li:not(:first-child)").css("display","none");

その他

章 ページ 場所 誤 正
4

139

 （サンプルデータ
「navigation.css」内）

 

/* ナビゲーションのli要素にhover用画像を指定 */
のコメントの下で
li#nav-top 以降 li#nav-faq までの指定について、
そのコメントの上の箇所で、不要な表記を重複させていた

以下を削除


li#nav-top {
background: url(top.png);
}
から
li#nav-faq {
background: url(faq.png);
}
4 149   th.top {
（中略）
background: url(top.png) no-repeat left top;
}
th.bottom {
（中略）
background: url(bottom.png) no-repeat left top;
}		 th.top {
（中略）
background: #f90 url(top.png) no-repeat left top;
}
th.bottom {
（中略）
background: #f90 url(bottom.png) no-repeat left top;
}

6刷での修正点

章 ページ 場所 誤 正
1 34   <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="feed.rdf" /> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="feed.xml" />

3

 103 下から2行目 body.ideas #global-nav li a#nav-ideas body.ideas #global-nav ul li a#nav-ideas
4 120 表組の見出し 「画像形式」「特徴」 「機能・エリア」「命名例」
4 136 注釈 インライン要素や「display:inline;」でスタイル設定された要素は、width、height、縦方向のmarginとpaddingが無視されますが、 インライン要素や「display:inline;」でスタイル設定された要素は、width、height、縦方向のmarginとpaddingを指定しても行内に余白が確保されてしまうため意図どおりに表示されませんが、
4 138 1つ目のソースコード #recent-entries ol li a:visited {
color: #335b77; /* 訪問済みリンクの文字色 */
background: url(check.gif) no-repeat right bottom; /* アイコン画像と表示方法、位置の指定 */
padding-right: 20px; /* アイコンの表示スペースを確保 */
}		 #recent-entries ol li a:visited {
padding-right: 10px; /* アイコンの表示スペースを確保 */
color: #222266; /* 訪問済みリンクの文字色 */
background: url(check.png) no-repeat right 5px; /* アイコン画像と表示方法、位置の指定 */
}
4 138 2つ目のソースコード さしかえ #recent-entries {
width: 180px;
background: #dce4b1 url(recent_bottom.gif) no-repeat left bottom;
}
#recent-entries ol {
margin: 0;
padding: 10px 0 10px 0; /* ボックス内のol要素の位置を調整 */
}
#recent-entries ol li {
margin: 0 12px 7px 15px; /* li要素の位置、間隔を調整 */
list-style-type: none; /* ブラウザデフォルトのリストマーカーを消す */
background: url(icon.gif) no-repeat 0 3px; /* アイコン画像と表示方法、位置の指定 */
padding-left: 18px; /* アイコンの表示スペースを確保 */
}
#recent-entries ol li a {
color: #ffffff; /* リンク文字色 */
}
#recent-entries ol li a:visited {
padding-right: 10px; /* アイコンの表示スペースを確保 */
color: #222266; /* 訪問済みリンクの文字色 */
background: url(check.png) no-repeat right 5px; /* アイコン画像と表示方法、位置の指定 */
}
#recent-entries ol li a:hover,
#recent-entries ol li a:focus,
#recent-entries ol li a:active {
color: #ffffff; /* カーソルオン、フォーカス、アクティブ時の文字色 */
}
4 140   縦方向のmarginやpaddingを指定することができません。 行内に余白が確保されてしまうため、縦方向のmarginやpaddingを指定しても思い通りの表示ができません。

その他

章 ページ 場所 誤 正
4 137 12行目 アイコンを表示スペースを アイコンの表示スペースを
4 137 最初のソースコード background: url(icon.gif)no-repeat 0 0.2em; background: url(icon.gif)no-repeat 0 3px;
6

200

 Google Chromeのハック html:not(:only-child:only-child) selector {...} Google Chrome 2.0へのバージョンアップにともない、
実装が変わってしまったようです。
なお、同じレンダリングエンジン（WebKitのHTMLエンジン）を利用するSafari 3では、Windows版とMac OS X版ともに有効でした。
6 202 IE8のハック html:first-child selector {...} 執筆時点ではIE 8 Beta 2または3にて検証していました。
正式版で実装が変わってしまっているようです。
追ってフォローします。
7 241 PSPブラウザの仕様 ACC AAC
A 320   sSafari3 Safari3