５月の授業日記

5/10

5/10　リンク
特別なファイル名（index.html）
サーバーでファイルを開くには正しいフォルダ名+ファイル名をアドレス欄に記述する必要がある
ファイル名を省略しフォルダ名までにすると
ファイルのリストが表示されてしまう（セキュリティ上危険）
index.html(もしくはｈｔｍ)という名前のファイルがある場合、そのファイルが開かれる
トップページ等はindexという名前にしておけばフォルダ名だけでアクセスできる
リンク
クリックしただけで指定したページを開ける
リンクがある部分のテキストはリンクカラーとなりアンダーラインが引かれる
DWでのリンクの指定方法
リンクさせたい部分をドラッグして選択しプロパティインスペクタのリンクの右の
ファイルの指定アイコン（P50step2）から、ファイルパネル内の開きたいファイルまでドラッグする
フォルダアイコンをクリックしオープンダイアログから開きたいファイルを指定
プロパティインスペクタのリンク部分にそのファイルまでの経路（パス）が記述されリンクできるようになる
確認はDWでは出来ないのでブラウザでプレビュー（P46）
画像によるリンク
画像にリンクを貼りたい場合は画像を選択し同様にプロパティインスペクタから設定
画像をコピーした場合リンクも同時にコピーされる
リンクカラーの設定
リンクカラーの設定はページプロパティより行う
きょうのひとこと
リンクが出来るとほぼホームページの機能が整います

--------------------------------------------------------------------------------

5/17

5/17　リンク2
（インターネット上のファイルへのリンク）
サーバー上の自分のページ

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

よく出来てると思う人

絶対パス
アクセス方法やマシン名フォルダ名をすべて記入したもの（URL）

http://=インターネット経由
ochagaku.sakura.ne.jp/＝サーバー名
2012/web/m0/＝ルートからフォルダをすべて入れる
イメージマップ（クリッカブルマップ）
1枚の画像の中にエリアを描きそれぞれに異なるリンク先を記述できる

画像を選択しプロパティインスペクタ左下マップ部分のツールで画像に矩形・楕円・多角形のエリアを描く
選択ツールで選択すると各エリアごとに異なるリンクが貼れる
エリアを区別する色はDW以外では見えない
ファイル名やフォルダの変更
リンクや画像の表示などにはファイル名やフォルダ名が記述されている
後からファイル名などを変更する場合はリンクしているファイル側でも記述を修正する必要がある
DWのファイルパネルから変更をした場合DWがそれらの修正を行ってくれる
パス（経路）

画像やリンクなど他のファイルを示す場合、記述するファイルから対象ファイルまでの経路（相対パス）を記述する
記述するファイルの階層（フォルダ）が変わると対象ファイルまでの経路も変わる
異なる階層間でのリンクや画像のコピーペーストはこの理由から出来ない
（違う階層からのコピー）
きょのひとこと
次回からページ内にエクセルのセルのようなものを作れるテーブルをやります

--------------------------------------------------------------------------------

5/24

5/24　テーブル
ページ内リンク
ページ内の指定した行にスクロールするリンク
ファイルではないため名前がないので代わりとなる名前（アンカーポイント）
挿入＞アンカーポイント
異なったページの指定部分にもリンクできる
メールリンク
お問い合わせは

リンクにmailto:メールアドレスと入れると送信先にそのメールアドレスが入力された状態でメーラーが立ち上がる
テーブル
ページ内にエクセルのセル（ワードの表）のようなものを挿入できる

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

テーブルの用語
表全体 テーブル
ひとつひとつのなかみ セル
境界線 ボーダー
背景色 テーブル全体とセル単位で設定可能（プロパティインスペクタ＞背景）
背景画像 各セルには背景画像も設定できる（DWにはバグがあるのでタグセレクタで＜td＞を選択し設定する）

幅の単位について
相対値（ブラウザの幅） ％
絶対値（固定） ピクセル
きょうのひとこと テーブルでまとめたほうが判りやすいものとそうでないものがあります

--------------------------------------------------------------------------------

5/31

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

テーブルの調整
ボーダーを消すことでテーブルをページのレイアウトに使うことが出来る
したいこと 属性 値
テーブルの枠線を消す ボーダー 0
セル同士をくっつける セル間隔 0
セルと内容物との間に余白をつける セル余白 読みやすい値

きょうのひとこと
次回は複数のページを同時に表示させるフレーム機能をやります