第3回目(通算第14回)
日 時：2013年6月14日 13:30～17:00
場 所：団交室Ⅰ Ⅱ
出席者：受講者 10名、HPWG 8名
講 師：小野 惠一
内 容：E班ホームページTOPページをCSSで修飾 前回の続き
- Internet Explorer F12開発者ツールの使い方
- HTMLマークアップの修正
前回番号なしリストulにした「担当・・・・2013年4月は休み（イオン）です」部分をpタグに変更し、「担当」を<span>で括った。
<ul>
<li>担当
<li>・・・・2013年4月は休み（イオン）です
</ul>
を 下記のとおりpタグに書き換え、idをtantoに設定した。
<p id="tanto"><span>担当</span>・・・・2013年4月は休み（イオン）です</p>
- 各班へのリンク部分番号なしリストulに「id="menu3"」を指定した。
- CSSによる修飾を行ない、ページを完成させた。
最終的にCSSの設定は下表のとおりとした。白地部分：前回設定 黄色部分本日設定
| body | フォント | "ＭＳ ゴシック", sans-serif |
| 行の高さ | 1.5 | |
| 背景色 | #447744 | |
| #container | 背景色 | 白 |
| 4方向マージン | 自動 | |
| 幅 | 800px | |
| #header | 水平方向の配置 | 中央 |
| 上方向パディング | 80px; | |
| 幅 | 800px | |
| #contents | 幅 | 800px |
| #footer | 前景色 | 白 |
| 背景色 | 黒 | |
| 行の高さ | 65px | |
| 水平方向の配置 | 中央 | |
| 幅 | 800px | |
| 高さ | 65px | |
| 回り込み解除 | 両方 | |
| p.center | 水平方向の配置 | 中央 |
| 回り込み解除 | 両方 | |
| ul | 4方向パディング | ０ |
| 4方向マージン | ０ | |
| リストマークのタイプ | なし | |
| ul.menu1 ul.menu2 |
4方向マージン | 自動 |
| 幅 | 720px | |
| ul.menu1 li | 行の高さ | 40px |
| 水平方向の配置 | 中央 | |
| 背景色 | #115522 | |
| 幅 | 220px | |
| 高さ | 40px | |
| 回り込み | 左 | |
| 右方向マージン | 20px | |
| ul.menu1 li a | 文字飾り | 無し |
| 前景色 | 白 | |
| 表示 | block | |
| ul.menu2 li | 水平方向の配置 | 中央 |
| 幅 | 220px | |
| 高さ | 65px | |
| 回り込み | 左 | |
| 右方向マージン | 20px | |
| p#tanto | 水平方向の配置 | 中央 |
| 上方向マージン | 50px | |
| 下方向マージン | 30px | |
| span | 前景色 | 白 |
| 背景色 | #77bb44 | |
| 文字間 | 10px | |
| 4方向ボーダー | 2px 実線 青緑 | |
| 上方向パディング | 3px | |
| 右方向パディング | 20px | |
| 下方向パディング | 3px | |
| 左方向パディング | 30px | |
| border-radius | 10px | |
| ul#menu3 | 幅 | 775px |
| 高さ | 40px | |
| 4方向マージン | 自動 | |
| ul#menu3 li | 背景色 | #aabbaa |
| 行の高さ | 30px | |
| 水平方向の配置 | 中央 | |
| 幅 | 150px | |
| 高さ | 30px | |
| 回り込み | 左 | |
| 右方向マージン | 5px | |
| ul#menu3 li a | 前景色 | 白 |
| 文字飾り | 無し | |
| 表示 | block |