5月の授業日記

4月の授業日記 >home  

5月
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24

25

26 27
28 29 30 31      

5/10 リンク

  • クリックするだけで指定したページを開ける
  • リンクがある部分のテキストはリンクカラー(ページプロパティで指定可)となりアンダーラインが引かれる

リンクの指定方法

  • リンクさせたい部分をドラッグして選択しプロパティインスペクタ/リンクの右の
    1. フォルダアイコンをクリックしオープンダイアログから開きたいファイルを指定
    2. ファイルの指定アイコン(P50step2)から、ファイルパネル内の開きたいファイルまでドラッグする
  • プロパティインスペクタ/リンク部分にそのファイルまでの経路(パス)が記述されリンクできるようになる
  • 確認はDWでは出来ないのでブラウザでプレビュー(P46)

特別なファイル名(index.html)

  • サーバーでファイルを開くには正しいファイル名+フォルダ名をアドレス欄に記述する必要がある
  • ファイル名を省略すると
    • ファイルのリストが表示されてしまう(セキュリティ上危険)
    • index.html(もしくはhtm)という名前のファイルがある場合、そのファイルが開かれる
    • トップページ等はindexという名前にしておけばフォルダ名だけでアクセスできる

リンク画像

  • リンクしている画像には枠線がつくが、ボタンなど分かる場合はくどいのでボーダーを0にする

 

きょうのひとこと

リンクが出来るとほぼホームページの機能が整います

カレンダーへ


5/17 リンク2

ファイル名の変更

  • リンクや画像の表示などにはファイル名/フォルダ名が記述されている
  • 後からファイル名等を変更する場合はリンクしているファイル側でも記述を修正する必要がある
    • DWのファイルパネルから変更をした場合DWがそれらの修正を行なってくれる

パス(経路)

  • 画像やリンクなど他のファイルを示す場合、記述するファイルから対象ファイルまでの経路(パス)を記述する
  • 記述するファイルの階層(フォルダ)が変わると対象ファイルまでの経路も変わる
    • 異なる階層間でのリンクや画像のコピー・ペーストはこの理由から出来ない
    • 違う階層からのコピー(違う階層からのコピー)

絶対パス(インターネット上のファイルへのリンク)

サーバー上の自分のページ

  • ファイルパネルやファイルの参照は使用できない
  • アドレス欄(URL)をコピーしプロパティインスペクタのリンクのテキストボックスにペーストする

絶対パス

アクセス方法やマシン名/フォルダ名をすべて記入したもの(URL)

  • http://=インターネット経由
  • www.ochagaku.ne.jp/=サーバー名
  • 2012/web/m0/=ルートからフォルダをすべて入れる

イメージマップ(クリッカブルマップ)

1枚の画像のなかにエリアを描きそれぞれに異なるリンク先を記述できる

 

  1. 画像を選択しプロパティインスペクタ左下マップ部分から画像に矩形・楕円・多角形のエリアを描く
  2. 選択ツールで選択すると各エリアごとに独立したリンクが張れる
  3. エリアを区別する色はDW以外では見えない
  4. カレンダーへ

     


5/24 テーブル

ページ内リンク

  • ページ内の指定した行にスクロールするリンク
  • ファイルではないので名前がないので代わりとなる名前(アンカーポイント)を英数半角でつけそこへリンクさせる
    • 挿入>アンカーポイント
  • 異なったページの指定部分にもリンクできる

メールリンク

お問い合せは

  • リンクにmailto:メールアドレスと入れると送信先にそのメールアドレスが入力された状態でメーラーが立ち上がる

テーブル

ページ内にエクセルのセル(ワードの表)のようなものを挿入できる

DWによるテーブル

行数・列数・サイズ(幅)などを最初に決める(後からプロパティインスペクタでも変更可能)

テーブルの用語

表全体 テーブル
一つ一つの中身 セル
境界線 ボーダー
背景色 テーブル全体とセル単位で設定可能(プロパティインスペクタ>背景)
背景画像 各セルには背景画像も設定できる

幅の単位について

相対(ブラウザの幅)
絶対(固定) ピクセル

 

きょうのひとこと テーブルでまとめたほうが判りやすいものもあります

カレンダーへ


5/31 テーブルを使ったレイアウト

テーブルの編集

行の挿入 プロパティインスペクタで行数を変える
挿入場所を選びたければ修正>テーブル>行または列の挿入
行の削除 選択してデリート
セルの結合 結合したいセルを選択しプロパティインスペクタ>選択したセルを結合
セルの縦揃え セル内は水平方向だけでなく垂直方向にも揃えができる
デフォルトはセンターなので上に揃えたい時は縦:上にする

テーブルの調整

ボーダーを消すことでページのレイアウトに使うことが出来る

したいこと 属性
枠線を消す ボーダー 0
セル同士をくっつける セル間隔 0
セルと内容物との間に余白をつける セル余白 読みやすい値
  • 多段組のレイアウトを行える
  • セルごとにエリアを色分けしたり背景画像をつけたり出来る