6/27 擬人クラスと絶対配置
インライン要素のブロックレベル化
| インライン要素 |
段落内の一部分 |
span,a |
| ブロックレベル要素 |
ボックスに出来る(改行を伴う) |
div,p,h |
aはインライン要素なので文字数に大きさが依存し操作しづらい
displayプロパティ
要素の元々持つ特性を変更できる
| :block |
ブロックレベル要素にできる |
| :inline |
インライン要素にできる |
| :none |
不可視にできる |
擬似クラス(:コロン)
文書構造で示せない状態などをセレクタにできる
| :link |
未訪問リンク |
| :visited |
訪問済み |
| :active |
クリック時 |
| :hover |
マウスカーソルがロールオーバーした時 |
:hoverはカーソルの状態が変化するのでその領域がリンク可能なことがわかりやすい
絶対配置
positionプロパティ
| 値 |
和訳 |
解説 |
| absolute |
絶対配置 |
絶対的な位置指定 |
| relative |
相対配置 |
基準位置からの絶対的な指定 |
position:abusolute
dwではデザインビューからドラッグしながら位置指定が行える
位置指定の基準位置を指定
無指定ではブラウザの左上が基準となり、センタリングなどずれてしまう
position:relative
- 基準としたいボックスにrelative指定する
- 絶対配置したいボックスはこのボックスの子要素(中に入れる)にする
今日のひとこと
#7月のヘッダーがセンターをセンターにするには。そしてクリックできる箇所にカーソルを置くと色が変わるようにするには。