6/6 表示効果のないタグのレイアウト

表示効果のないタグ


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

ID属性の利用

  • classは再出可能だがIDは一度しか出現しないので場所を特定できる
  • DWはこれを用いて挿入歌書などを特定している
  • 表示効果のないタグの挿入

    挿入ダイアログにより位置情報を指定して挿入する
    開始タグの後ろ 対象ID内の最前部に挿入
    終了タグの前 対象ID内の最後部に挿入

    きょうのひとこと

    多分できてる気がします

    6/13 ボックスモデルとフロート

    ボックスモデル


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

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

    CSSパネルでの入力


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

    各丸指定が可能

    Floatによるレイアウト


    float

  • ボックス幅一杯だった要素が浮き上がり後継要素が回り込む
  • widthでサイズ指定、 絡む落ち対策にbox-sizing:boder-box
  • clear

  • floatをclear:bothで解除
  • 今日のひとこと

    慣れてきました。

    6/20 フロートナビゲーション

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


    メンテナンス性に優れるため主流

    グローバルナビゲーション

    トップ第一階層にいつでもいけるナビゲーション

    ローカルナビゲーション

    その項目内のナビゲーション

    floatのナビ


  • 分割数分の幅をwidthで指定
  • float:left
  • ulのバディングマージンを取る
  • 子孫セレクタ


  • ナビゲーション内のリストのように特定の親要素ないのお子要素だけを指定可能
  • 半角スペースで区切る
  • 今日のひとこと

    大体はできました