MdNCORPORATION

ああしたい、こう変えたいが手にとるようにわかるCSS基礎

ああしたい、こう変えたいが手にとるようにわかるCSS基礎

赤間 公太郎 著/原 一宣。 著/藤川 麻夕子 著/山本 和泉 著
定価 2,420円
(本体 2,200円+税10%)
※電子書籍の価格は各販売ストアにてご確認ください。
発売日 2015-07-17
仕様 B5変形判/224P
ISBN 978-4-8443-6512-9
本書はCSSの仕組みや書き方、考え方をていねいに解説した入門書です。Webサイト(ホームページ)作成の初心者の方がCSSを書くときに、一番難しい点のひとつが「どこを変えるか」を見つけることです。そのため本書の解説では、CSSの書き方や使い方だけではなく、「変えたい場所の探し方」(HTMLと組み合わせたCSSの読み方、セレクタの使い方)を理解し、身につけてもらうことに重点を置いています。 全体は11章構成になっており、1〜3章ではHTML、CSSやWebサイトの基本を紹介しています。4〜8章では「文字のサイズを変える」、「背景の色を変える」など、目的別にCSSの書き方、プロパティの使い方を解説。9〜11章は実践編となり、すでにでき上がっているWebサイト・ブログを題材にして、デザインの一部をカスタマイズする方法を解説しています。なお、サンプルは完成ファイルをお手本に、練習ファイルを作成していく形式です(ダウンロード提供)。Webサイトやブログのデザインをカスタマイズしたい方、CSSをゼロからしっかり学びたい方に最適の内容になっています。


■ページ見本










目次

■CHAPTER 1 HTMLとCSS
01 Webページは何でできている?
02 HTMLの役割
03 CSSの役割
04 Webページを構成する要素
05 基本的なHTMLタグ

■CHAPTER 2 CSSの基本
01 CSSの基本構造
02 セレクタの基本
03 CSSを記述する場所
04 Webページで使われる単位
05 CSSで使われる色
06 CSSの基本概念

■CHAPTER 3 Webをデザインする準備
01 Web制作に必要な環境を整えよう
02 Webサイトの作成に使うWebブラウザ
03 Web制作に使用するテキストエディタ
04 Bracketsの基本的な使い方
05 画像編集のアプリケーション

■CHAPTER 4 文字(テキスト)
01 Webページのテキスト
02 Webサイト全体の文字のサイズを変える
03 Webページ全体の文字色を変える
04 フォントの種類を変更する
05 文字を太くする
06 文字を斜体にする
07 行の高さを調整する
08 文字の字間を調整する
09 水平方向の位置を指定する
10 テキストリンクの色を変更する ほか

■CHAPTER 5 色(カラー)
01 Webサイトと色
02 背景の色を変える
03 見出しや段落の背景色を変える
04 背景の画像を指定する
05 テキストの一部に効果をつける ほか

■CHAPTER 6 装飾
01 枠線をつける
02 表に枠線をつける
03 縦の項目を線で区切る
04 ボックスに影をつける ほか

■CHAPTER 7 レイアウト
01 CSSのレイアウトの基本
02 内側の余白を調整する
03 外側の間隔を調整する
04 横幅を指定する
05 高さを指定する
06 文章を画像に回り込ませる
07 画像を装飾する
08 左右2段組にレイアウトする ほか

■CHAPTER 8 見出しを装飾する
01 見出しに背景色をつける
02 見出しにアンダーラインを引く
03 見出しの始まりに装飾を入れる
04 見出しを枠線で囲む ほか

■CHAPTER 9 CSSを適用する
01 CSSの指定箇所を探すには
02 強制的にCSSを適用させる方法

■CHAPTER 10 Webサイトの装飾を変える
01 Webサイトの装飾を変えてみよう[初級編]
02 Webサイトの装飾を変えてみよう[中級編]
03 Webサイトの装飾を変えてみよう[上級編]

■CHAPTER 11 ブログのCSSを変える
01 WebサービスにCSSを適用する[アメブロ編]
02 WebサービスにCSSを適用する[Jimdo編]

巻末:用語索引

ダウンロードデータ

ああしたい、こう変えたいが手にとるようにわかる CSS基礎

サンプルデータのダウンロードについて



このたびは、『ああしたい、こう変えたいが手にとるようにわかる CSS基礎』をご購入いただきまして、誠にありがとうございます。以下に、本書の解説で使用したサンプルデータを用意しましたのでご利用ください。


○本書のサンプルデータ(HTML・CSS・JPG)
CSS_basic.zip(約2.3MB)



【本書のサンプルデータ】


サンプルデータはChapter(章)ごとに、各記事番号のフォルダに分かれており、それぞれ「練習用ファイル」と「完成ファイル」が収録されています(練習用ファイル、完成ファイルの数は記事ごとに異なります)。

○練習用ファイルは、フォルダ名やファイルの末尾に「_before」とついているものです。
例)記事番号 Chapter4-02の場合には「04-02_before」フォルダ、04-02_before.html、04-02_before.cssなど
○完成ファイルは、フォルダ名やファイルの末尾に「_after」とついているものです。
例)記事番号 Chapter4-02の場合には「04-02_after」フォルダ、04-02_after.html、04-02_after.cssなど


【ダウンロードにあたってのご注意】


ダウンロードファイルは、ZIP形式で圧縮されています。Windows、Macそれぞれの解凍ソフトを使って圧縮ファイルを解凍してください。

解凍したフォルダ内には、本書の解説で使用したデータが収録されています。フォルダ内に「readme.html」が同梱されていますので、必ずご使用の前にお読みください。


【ダウンロードファイル解凍時のご注意】


Windowsをご利用の場合は、ダブルクリックしてもダウンロードファイルを正しく解凍できない場合があります。リンク画像が表示されないなど、サンプルファイルの閲覧に問題がある場合は、次の手順でファイルの解凍をお試しください。

[1]ダウンロードしたファイルを右クリック
[2]表示されたメニューから[すべてを展開...]を選択
[3]ファイルを解凍するダイアログが表示されるので、保存場所を選択して実行
[4]指定した場所にファイルが解凍される


【サンプルデータの使い方】


ダウンロード後、解凍したサンプルデータは以下のような手順でお使いいただけます。

[1]はじめに、各記事番号フォルダの中にある練習用のHTMLファイル「○○-○○_before.html」をInternet Explorer、Google ChromeなどのWebブラウザで開きます。

[2]次に、練習用ファイルと同じ記事番号フォルダの中にある完成用のHTMLファイル「○○-○○_after.html」をWebブラウザ開きます。練習用、完成それぞれの表示の違いをWebブラウザで確認してみましょう。

[3]本書の解説記事に、練習用のCSSファイルやHTMLファイルを使ってサンプルを変更していく方法が記載されています。解説内容に従って、完成ファイルを見本にしながらサンプル(練習用ファイル)を変えていきましょう。


【ダウンロードファイル解凍時のご注意】


※弊社Webサイトからダウンロードできるサンプルデータは、本書の解説内容をご理解いただくために、ご自身で試される場合にのみ使用できる参照用データです。その他の用途での使用や配布などは一切できませんので、あらかじめご了承ください。

※弊社Webサイトからダウンロードできるサンプルデータの著作権は、それぞれの制作者に帰属します。

※弊社Webサイトからダウンロードできるサンプルデータを実行した結果につきましては、著者および株式会社エムディエヌコーポレーションは一切の責任を負いかねます。お客様の責任においてご利用ください。

※本書に掲載されているHTML、CSSなどのコメントや改行位置などは、紙面掲載用として加工していることがあります。ダウンロードしたサンプルデータとは異なる場合がありますので、あらかじめご了承ください。

※サンプルデータをWebブラウザで開いた際に表示されるフォントは、お使いのパソコンのOSやWebブラウザの種類・バージョンにより、サンプルデータと紙面とは異なる場合があります。あらかじめご了承ください。

制作の基本からデザイン業界の最新状況まで! MdNのデザイン・グラフィック書8選

デザイン・制作・マーケティング Webでもう困らない! わかりやすくて知識が身につく8冊