表示効果のないタグ

表示効果のないタグはビジュアルエディタでの操作は難しい

ID属性の使用

• classは再出可能だがIDは一度しか出現しないので場所を特定できる
• DWではこれを用いて挿入箇所などを指定している

表示効果のないタグの挿入

挿入のダイアログより位置を指定して挿入する

今日のひとこと

セレクターがいっぱいあって少し混乱する。あと画像の配置がよくわからなくなる時がある

ボックスモデル

ブロックレベル要素は以下の設定をもつボックスから成り立つ

1. content
2. padding
3. border
4. margin

CSSパネルでの入力

• 上部は四辺一括またはショートハンド
• 四辺分割指定する場合は下部　っっっc

floatによるレイアウト

float

• ボックス幅いっぱいだった要素が浮き上がり後継要素が回り込む
• widthでサイズ指定、カラム落ち対策にbox-sizing:border-box

clear

• floatwoをclear:bothで解除

今日のひとこと

急に角が丸くなってびっくりしました。あとエアコンが寒かったです；；

CSSを使用したナビゲーション

メンテナンス性に優れる

子孫セレクタ

• 特定の親要素内の子要素だけを指定
• 半角スペースで区切る

今日のひとこと

セレクターがとても便利なことに今更ながら気づいてしまった＾＾

インライン要素のブロックレベル化

aはインライン要素なので文字数に大きさが依存し操作しづらい

displayプロパティ

要素のもともと持つ特性を変更できる

擬似クラス （：コロン）

文書構造で示せない状態などをセレクタにできる

:hoverはカーソルの状態が変化するのでリンク可能なことがわかりやすい

絶対配置

positionプロパティ

position：position

dwではデザインビューからドラッグしながら位置指定が行える

位置指定の基準位置を指定

無指定ではブラウザの左上が基準となり、センタリングなどずれてしまう

position:absolute

• 基準としたいボックスにrelative指定する
• 絶対配置したいボックスはこのボックス子要素（中に入れる）にする

今日のひとこと

感覚的にはわかるけど文字で説明されると難しい