作りながら学ぶ HTML/CSSデザインの教科書

正誤表

本書に誤り、または不十分な記述がありました。下記のとおり訂正し、お詫び申し上げます。

No.018

ページ P85
訂正箇所 border-collapseを削除する記述内容全てについて
対応方法 P83のnormalize.cssが4にバージョンアップしたことにより、normalize.cssから次の記述が削除されました。
table {
  border-collapse: collapse;
  border-spacing: 0;
}
したがって、[common/css/style.css]から、「border-collapse: collapse;」を削除する必要はありません。
※第8刷以降では、該当部分の記述は削除されています。

追加日:2014/3/31

No.017

ページ P174
訂正箇所 ◯相対パス 下から3行目
01.htmlから02.htmlにリンクする場合も同様に、
02.htmlから01.htmlにリンクする場合も同様に、

追加日:2014/3/31

No.016

ページ P104
訂正箇所 P83のnormalize.cssが3.0.1にバージョンアップしたことにより、figureタグのマージンが変更されました。
本書と同様に上下左右のマージンがない状態とするには、P104のCSSの記述に下記のようにfigureタグのマージンを0を追加してください。
対応方法
/* 図版 */
figure {
  margin: 0;
}
/* 画像キャプション */
figcaption {
  font-size: 12px;
}

追加日:2014/3/31

No.015

ページ P190
訂正箇所 手順7 リストをコンテンツの横幅内におさめる の2行目
5つめのリスト
4つめのリスト

追加日:2014/3/31

No.014

ページ P189
訂正箇所 手順4 リストの横幅を設定し、横並びにする の2行目
245px(980/5=245)
245px(980/4=245)

追加日:2014/3/31

No.013

ページ P21
訂正箇所 MEMO内

追加日:2014/3/31

No.012

ページ P100,P102,P103
訂正箇所 ページ内のソースコード中すべて:pタグと画像の位置が逆です。
<h3 class="heading-typeB">・・・・・</h3>
<img src=・・・・・>
<p>・・・・・</p>
<h3 class="heading-typeB">・・・・・</h3>
<p>・・・・・</p>
<img src=・・・・・>

追加日:2014/3/24

No.011

ページ P277 「8-1-2 jQueryプラグインでスライドショーを作る」
訂正箇所 2014年1月24日にバージョンアップされたjQueryのバージョン1.11.0にて、bxSliderのアニメーションがおかしくなる件について、 現在のところ次の2つの方法のどちらかによって対処する必要がありますが、bxSliderが今後バージョンアップして対応する可能性もあります。
対応方法1 下記URLにて「Past Releases」にて過去のバージョンのjQueryをダウンロードすることができます。
http://code.jquery.com/jquery/
最新の1.11.0ではなく、動作確認がとれているバージョン1.10.1をダウンロードして利用してください。
対応方法2 jQueryのバージョン1.11.0でも、下記のようにbxSliderのオプションにuseCSS: falseを追加すると対処できます。
<script>
  $(document).ready(function() {
    $('.bxslider').bxSlider({
      auto: true,
      speed: 1000,
      pause: 4000,
      useCSS: false
    });
  });
  </script>

追加日:2014/2/24

ここから以下の訂正は、第1版での修正です。第2版以降では訂正済みです。

No.010

ページ P217
訂正箇所 手順2の「フォルダ構成」から、「img_02_04.jpg」を削除

追加日:2014/1/18

No.009

ページ P217
訂正箇所 手順2の「ダウンロードファイル」から、「07/7-1-1/images/img_02_04.jpg」を削除

追加日:2014/1/18

No.008

ページ P173
訂正箇所 ソースコード中:下から4行目
<li><a href=“about/index.html">おといあわせ</a></li>
<li><a href=“contact/index.html">おといあわせ</a></li>

追加日:2014/1/18

No.007

ページ P276
訂正箇所 本文下か5行目
bsSlider
bxSlider

追加日:2014/1/3

No.006

ページ P042
訂正箇所 「1 見出しにクラス属性を追加する」ソースコードの下から6行目
<h2 class="heading-typeC">cafe & kitchen nest</h2>
<h2 class="heading-typeC">kitchen nest</h2>

追加日:2014/1/3

No.005

ページ P073
訂正箇所 「6 横幅を指定する」ソースコード
.table-typeA th,
.table-typeA td {
  border: 1px solid #CCCCCC;
  padding: 5px 10px;
}
table th,
table td {
  border: 1px solid #CCCCCC;
  padding: 5px 10px;
}

追加日:2013/12/24

No.004

ページ P071
訂正箇所 「3 罫線と罫線の隙間をなくす」ソースコード
.table-typeA th,
.table-typeA td {
  border: 1px solid #CCCCCC;
  padding: 5px 10px;
}
table th,
table td {
  border: 1px solid #CCCCCC;
  padding: 5px 10px;
}

追加日:2013/12/24

No.003

ページ P122
訂正箇所 【解説】特殊文字、下部のURL
http://www.w3.org/TR/2011/WD-html5-20110113/named-character-references
http://www.w3.org/TR/html5/syntax.html#named-character-references

追加日:2013/12/20

No.002

ページ P054
訂正箇所 「border-style」で指定できる線の種類のCSS(ページ右下)
p {
  border-width: 10px;
  border-color: #3399FF;
}
p {
  color: #3399FF;
  border-width: 10px;
  border-color: #FF9900;
}

追加日:2013/12/20

No.001

ページ P033
訂正箇所 下から4行目「W3Cによって定められたHTML5の仕様書」のURL
http://www.w3.org/TR/2012/CR-html5-20121217/
http://www.w3.org/TR/html5/

追加日:2013/12/20