『これからWebをはじめる人のHTML&CSS、JavaScriptのきほんのきほん』サポートサイト

cover-kihon2017_h1.jpg

このページは『これからWebをはじめる人のHTML&CSS、JavaScriptのきほんのきほん』のサポートページです。

書籍詳細ページへ

サンプルファイル

本書で使用しているサンプルファイルをダウンロードできます。

ダウンロードはこちら → samplefiles.zip

 

訂正情報

■sanitize.cssのバージョンアップについて

本書で使用しているsanitize.cssはバージョン4.0.0ですが、公式サイトで配布されているバージョンは随時上がっています。公式サイトで配布されているバージョンをお使いになりますと、本書の内容と画面が異なることがあります。本書で勉強する際は、以下のバージョン4.0.0をお使いください。

sanitize.css バージョン4.0.0

 

以下の訂正がございます。ご迷惑をおかけして大変申し訳ございません。

 

===================

●82ページ :最後のコードの見出しが「index.html」となっておりましたが、「style.css」の誤りです。ご迷惑をおかけいたしました(2刷にて修正)。
 
 

===================

●125ページ :3つ目のCSSのコード5行目のコードにて、「and」が抜けていました。ご迷惑をおかけいたしました(2刷にて修正)
誤)
@media only screen (max-width:600px) {
正)
@media only screen and (max-width:600px) {


===================

 
●127ページ :ソースコードの10行目から12行目のコードが不要でした。ご迷惑をおかけいたしました(3刷にて修正)
削除)
.description h1 {
  font-size: 14px; /* 文字サイズを少し小さくする */
}
 

===================

 
●154ページ :ソースコード4行目にて、不要な表記がありました。ご迷惑をおかけいたしました(3刷にて修正)。
誤)
<form action="https://h2o-space.com/html-book/sample04/" method="post">
正)
<form method="post">


===================

 
●190ページ :コラムの図5-1-Aに表示される数字が、「103」になるべきところ、「13」になっていました。ご迷惑をおかけいたしました(2刷にて修正)
正)
図5-1-A
5-1-Anew-up-300x252.png


 

===================

 
●211ページ :比較演算子の表3行目(見出し行含む)にて、誤りがありました。ご迷惑をおかけいたしました(3刷にて修正)。
誤)
A => B
正)
A >= B
 

===================

 
●238ページ :index.htmlの9行目にて、誤りがありました。ご迷惑をおかけいたしました(3刷にて修正)。
誤)
this.classList.remove('btn-default');
正)
this.classList.remove('btn-primary');
 
 

===================

●240ページ :前のページから続くindex.htmlの10行目にて、誤りがありました。ご迷惑をおかけいたしました(3刷にて修正)。
誤)
this.classList.remove('btn-default');
正)
this.classList.remove('btn-primary');
 

===================

 
●240ページ :2つめのindex.htmlの6行目にて、誤りがありました。ご迷惑をおかけいたしました(3刷にて修正)。
誤)
this.classList.remove('btn-default');
正)
this.classList.remove('btn-primary');
 

===================

 
●247ページ :前のページから続くstyle.cssの52 行目は不要でした。ご迷惑をおかけいたしました(3刷にて修正)。
削除)
font-color: #666; /* 文字色をグレーに */
 
 ===================
 
●256ページ :「値のインデックスを取得する - indexOf」のコード2行目で、閉じカッコが1つ足りませんでした。ご迷惑をおかけいたしました(2刷にて修正)
誤)
alert(pref.indexOf(' 青森県'); // 1
正)
alert(pref.indexOf(' 青森県')); // 1




 

===================

 
●262ページ :index.htmlの12 行目に誤りがありました。ご迷惑をおかけいたしました(3刷にて修正)。
誤)
…+ images[i].date +

 

正)
…+ images[i].name +

 

 
 ===================
 
●272ページ :index.htmlの15行目が、JSONデータのキーと対応しておりませんでした。ご迷惑をおかけいたしました(2刷にて修正)
正)
caption.innerHTML = '<p>' + data.caption + '<span>' + data.name + '</span></p>';
 


 ===================
 
●277ページ :index.htmlの14-17行目において、<div class="container">の位置が間違っておりました。<div class="container">はheader要素の外側においてください。ご迷惑をおかけいたしました(2刷にて修正)
誤)
<div class="container">
  <header>
    <h1>My Photos</h1>
  </header>
  <div id="img_unit">

正)
<header>
  <h1>My Photos</h1>
</header>
<div class="container">
  <div id="img_unit">

 
 
 ===================
 
●282ページ :1つ目のスクリプトコードで、クオテーションが1つ足りませんでした。100pxの前に追加します。ご迷惑をおかけいたしました(2刷にて修正)
正)
$('#img_unit').html(' ここに、画像リストが表示されます').css('margin-top', '100px');
 


 ===================
 
●293ページ :P.277と同様に、index.htmlの14-19行目において、「<div class="container">」の位置が間違っておりました。<header>は<div class="container">の外側においてください。ご迷惑をおかけいたしました(2刷にて修正)
誤)
<div class="container">
  <header>
    <h1>My Photos</h1>
  </header>

  <div id="img_unit">


正)
<header>
  <h1>My Photos</h1>
</header>

<div class="container">
  <div id="img_unit">

 

 ===================
 
●294ページ :index.htmlの31行目(1刷では32行目)が、JSONデータのキーと対応しておりませんでした。ご迷惑をおかけいたしました(2刷にて修正)
誤)
.append('<div class="inner"><p>' + data[i].memo + '<span>' + data[i].date + '</span></p></div>')
正)
.append('<div class="inner"><p>' + data[i].caption + '<span>' + data[i].name + '</span></p></div>')

 

補足情報

AppendixのP.304から紹介している「Node.js」ですが、Windows環境ではインストール時にエラーが出てしまうことが多いようです。お手数をおかけしますが、以下のサイトなどをご参考にしてください。

 

Windows の Node.js 開発環境構築 最小手順
 

Windowsでnpm installの赤いエラーに悩まされているアナタへ


 

 
●170ページ :ソースコード2行目にて、誤りがありました。ご迷惑をおかけいたしました(3刷にて修正)。
誤)
@media screen and (max-width: 992px) {
正)
@media only screen and (max-width: 992px) {