PAGE 2011『DTP制作者のための EPUBのXHTML+CSS編集』セッションフォローアップ(2)
PAGE 2011でのセミナー終了後に、リクエストいただいたので、ePub編集を行う上で最低限覚えておきたいタグなどをリストアップしてみました。
最低限覚えておきたいHTMLのタグ
ブロックレベル要素は「段落スタイル」、インライン要素は「文字スタイル」にあたります。
ePubで使えるHTMLのタグはこちらに定義されています。
種類 | カテゴリ | タグ | 読み方 | 意味 | 由来 |
---|---|---|---|---|---|
ブロックレベル | 骨組み | html | エイチティーエムエル | - | |
head | ヘッド | - | |||
body | ボディ | - | |||
テキスト | h1〜h6 | エイチ | 見出し | heading | |
p | ピー | 段落 | paragraph | ||
div | ディブ | 任意の範囲、グループ化 | division | ||
リスト | ul | ユーエル | 番号なしテキスト | unordered list | |
ol | オーエル | 番号付きテキスト | ordered list | ||
li | リストの項目 | list item | |||
その他 | table | テーブル | 表 | - | |
インライン | 強調 | em | エム | 強調 | emphasis |
strong | ストロング | より強調 | - | ||
その他 | a | エー(アンカー) | リンク箇所 | anchor | |
br | ビーアール | 改行(段落内) | line break | ||
img | イメージ | 画像 | image | ||
span | スパン | 汎用的に使用 | - |
最低限覚えておきたいCSSのプロパティ
ePubで使えるCSSのプロパティはこちらに定義されています。
カテゴリ | 項目名 | ざっくりした意味 |
---|---|---|
文字まわり | font-family | フォント |
font-size | サイズ | |
font-weight | ウエイト | |
font-style | スタイル(斜体/正体) | |
line-height | 行送り | |
text-decoration | 下線や取消線 | |
color | 文字の色 | |
letter-spacing | 文字間隔 | |
text-align | 行揃え | |
text-indent | 1行目のインデント | |
要素 | background-color | 背景色 |
width | 幅 | |
height | 高さ | |
float | 回り込み | |
padding | 内側の余白 | |
margin | 外側の余白 | |
ボーダー | border-style | 枠線のスタイル |
border-width | 枠線の幅 | |
border-color | 枠線のカラー |
そのほか、CSSをやっつける上では次のあたりがポイントになります。
- CSSの記述場所
- CSSの構文
- CSSセレクター
- ボックスモデル(padding/margin/borderの関係と計算方法)
- CSSリセット
- 優先順位(継承、詳細度)
『効率的なサイト制作のためのDreamweaverの教科書』では、Lecture 5-1から5-8(pp.96-121)をご参照ください。