できるポケット Web制作必携 HTML&CSS全事典 改訂版 HTML Living Standard & CSS3/4対応

できるポケット Web制作必携 HTML&CSS全事典 改訂版 HTML Living Standard & CSS3/4対応

¥1,880+税

品種名
書籍
発売日
2020/2/14
ページ数
528
サイズ
B6判
著者
加藤善規 著/できるシリーズ編集部 著
ISBN
9784295008286

HTML&CSSの最新仕様に完全対応!

本書は、HTML Living Standardの仕様に準拠した要素(タグ)と、主要なブラウザーで動作するCSS3およびCSS4のプロパティをすべて掲載しています。手元に置いておきやすいコンパクトなB6判で、目次のほかに要素名・プロパティ名のインデックスもあるので、必要な情報をサッと調べることが可能です。本書では、ほとんどの要素やプロパティにサンプルコードを掲載しています。また、読者限定でサンプルコードのダウンロード特典もついています。

「読者アンケートに答える」「読者プレゼントに応募」の場合もこちらをご利用ください。

アンケートに答える

書籍の内容に関するお問い合わせはこちら。お答えできるのは本書に記載の内容に関することに限ります。

学校・法人一括購入に関するお問い合わせはこちらへ。

一括購入窓口

著者紹介

加藤 善規(かとう よしき)



フリーランスによるWebサイト制作業務、Webサイト制作会社での取締役などの経験を経て、2014年にバーンワークス株式会社を設立、代表取締役に就任。Webサイト制作ディレクション、Webアクセシビリティ、ユーザビリティに関するコンサルティング業務の他、セミナー等での講演、執筆等も行う。

目次

HTML編
ドキュメント
セクション
コンテンツのグループ化
テキストの定義
埋め込みコンテンツ
テーブル
フォーム
インタラクティブ
スクリプティング
HTMLの基礎知識

CSS編
セレクター
フォント/テキスト
色/背景/ボーダー
ボックス/テーブル
段組み
フレキシブルボックス
グリッドレイアウト
アニメーション
トランスフォーム
コンテンツ
CSSの基礎知識

関連書籍

好評発売中

世界一やさしいプラス WordPress 5.x対応

簡単手順でWebサイトをサクサク作ろう

好評発売中

できるホームページ・ビルダー22 SP対応

かんたん・きれい・本格的なページを作れる!

特典

本製品にはご購読の読者様がご利用できる「特典」サービスがついています。お手元に本製品を用意し、「特典を利用する」ボタンから画面の指示に従ってお進みください。

特典を利用する

ダウンロード

本製品の読者さまを対象としたダウンロード情報はありません。

お詫びと訂正

誤記のためにご迷惑をおかけし、誠に申し訳ございません。

  • 53ページ サンプルコード 9行目
    • [誤]
      <script src="/js/scipt.js">
    • [正]
      <script src="/js/scipt.js"></script>
    • 【 第2刷にて修正 】
  • 61ページ 実践例 サンプルコード 5~6行目
    • [誤]
      <li><a href="/blog">メニュー</a></li>
      <li><a href="/contact/">店舗情報</a></li>
    • [正]
      <li><a href="/blog/">メニュー</a></li>
      <li><a href="/shop/">店舗情報</a></li>
    • 【 第2刷にて修正 】
  • 145ページ value属性の解説文
    • [誤]
      また、type属性値がsubmit、image、reset、buttonの場合は、value属性の値が表示されるbeforeボタン名となります。
    • [正]
      また、type属性値がsubmit、reset、buttonの場合は、value属性の値がボタンに表示されるラベルとなります。
    • 【 第2刷にて修正 】
  • 165ページ 使用できる属性 一覧
    • [誤]
      valueを含む
    • [正]
      valueを含まない
    • 【 第2刷にて修正 】
  • 165ページ 使用できる属性 本文
    • [誤]
      value属性で指定した値は、ボタンに表示されるラベルとして使用されます。
    • [正]
      (削除)
    • 【 第2刷にて修正 】
  • 193ページ サンプルコード 2行目
    • [誤]
      <style><!--省略--></style>
    • [正]
      <style>/*省略*/</style>
    • 【 第2刷にて修正 】
  • 233ページ 本文
    • [誤]
      以下の例では、閲覧者が操作しているフォームの入力コントロールにスタイルを適用し、背景色を薄い赤で表示しています。
    • [正]
      以下の例では、閲覧者が操作しているtype="text"が指定されたフォームの入力コントロールにスタイルを適用し、背景色を薄い赤で表示しています。
    • 【 第2刷にて修正 】
  • 233ページ CSS サンプルコード 1行目
    • [誤]
      input[type]:focus {
    • [正]
      input[type="text"]:focus {
    • 【 第2刷にて修正 】
  • 233ページ HTML サンプルコード 9行目
    • [誤]
      <input type="type" name="address" id="address" value="">
    • [正]
      <input type="text" name="address" id="address" value="">
    • 【 第2刷にて修正 】
  • 238ページ 下段 サンプルコード 1行目
    • [誤]
      textarea:disable {
    • [正]
      textarea:disabled {
    • 【 第2刷にて修正 】
  • 239ページ 上段 サンプルコード 1行目
    • [誤]
      type[checkbox]:checked {
    • [正]
      input[type="checkbox"]:checked {
    • 【 第2刷にて修正 】
  • 246ページ 要素名::first-line 本文およびサンプルコード
    • [誤]
      以下の例では、p要素のマージンを広くしたうえで、段落の1行目にのみ別のスタイルを適用し、広くしたマージンを取り消しています。

      p {
      margin-left: 1em;
      }
      p::first-line {
      margin-left: -1em;
      }
    • [正]
      以下の例では、p要素のフォントサイズを指定したうえで、段落の1行目にのみ別のフォントサイズを適用しています。

      p {
      font-size: 1rem;
      }
      p::first-line {
      font-size: 1.5rem;
      }
    • 【 第2刷にて修正 】
  • 324ページ 引数の指定方法 サイズ 2行目
    • [誤]
      closet-side
    • [正]
      closest-side
  • 324ページ 引数の指定方法 サイズ 3行目
    • [誤]
      farset-side
    • [正]
      farthest-side
  • 324ページ 引数の指定方法 サイズ 4行目
    • [誤]
      closet-corner
    • [正]
      closest-corner
  • 324ページ 引数の指定方法 サイズ 5行目
    • [誤]
      farset-corner
    • [正]
      farthest-corner
  • 346ページ 値の指定方法 下から2行目
    • [誤]
      値が2つ 1つ目が左右上角、2つ目が左右下角に適用されます。
    • [正]
      値が2つ 1つ目が左上角と右下角、2つ目が右上角と左下角に適用されます。
    • 【 第2刷にて修正 】
  • 392ページ 値の指定方法 下から2行目
    • [誤]
      1つ目は上下、2つ目は左右の間隔に適用されます。
    • [正]
      1つ目は左右、2つ目は上下の間隔に適用されます。
  • 421ページ ページ下部 本文
    • [誤]
      flex-direcrionプロパティ(P.347)
    • [正]
      flex-directionプロパティ(P.422)
  • 470ページ サンプルコード 5行目以降
    • [誤]
      .box {
      background-color: yellow;
      animation-name: box-animation;
      animation-delay: 5s;
      animation-fill-mode: both;
      }
    • [正]
      .box {
      background-color: yellow;
      animation-name: box-animation;
      animation-delay: 5s;
      animation-fill-mode: both;
      animation-duration: 1s;
      }
  • 482ページ 値の指定方法 rotateY()の解説文
    • [誤]
      正の数値を指定すると、要素の左辺が画面の奥に向かって回転します。
    • [正]
      正の数値を指定すると、要素の右辺が画面の奥に向かって回転します。

お問い合わせ

書籍の内容に関するお問い合わせはこちら。お答えできるのは本書に記載の内容に関することに限ります。

お問い合わせフォーム