本文へスキップ

パソコンサポート

ポックルの部屋

ホーム  > ホームページ関連メニュー  > Microsoft Expression Web 4 の使い方

基本操作・3-06.装飾


見出しを挿入するには

  1. (1) 見出しにする文字列(ここでは「レシピ」)をドラッグして選択し、
    (2) 共通ツールバーの「スタイルボックス」をクリックし、
    (3) 一覧から見出しを選択します。ここでは「見出し1<h1>」をクリックします。
    (見出し1<h1>が一番大きく、見出し6<h6>が小さい文字になります)
    見出し1
  2.  レシピの文字が大きくなりました。
    文字が大きくなった
  3. 同様に「ふんわりオムレツ」を1レベル下げて「見出し2<h2>」にしましょう。
    見出し2に設定


箇条書きリストを作成するには

  1. 箇条書きリストには【番号付き】と【記号付き】の2種類があります。ここでは「記号付き」のリストを作成します。メニューを作るときに役立ちます。

    (1) 箇条書きを設定する文字列(ここでは「ホーム」)をドラッグして選択し、
    (2) 共通ツールバーの「スタイルボックス」をクリックし、
    (3) 一覧から「記号付きリスト<ul>」をクリックします。
    記号付きリスト
  2. 「・」が項目の先頭に表示されます。
    先頭に●が付く




    また、語尾(ホームのムの後ろ)で エンター(エンター)キーを押すと、先頭に「・」が表示され、次の項目が入力できるようになります。
    次の項目


ハイパーリンクを設定するには

  1. (1) リンクを設定する文字列(ここでは「ホーム」)をドラッグして選択し、
    (2) メニューの「挿入」をクリックし、
    (3)「ハイパーリンク」をクリックします。
    ハイパーリンク
  2. (4) リンクするWebページをクリックします。
    (ここでは「index.html(編集中)」を選択しました)
    (5)「ターゲットフレーム」ボタンをクリックします。
    ターゲットフレーム
  3. (6)「ページ標準(なし)」になっていることを確認します。
    (もし、新しいウィンドウで開きたい場合は「新しいウィンドウ」を選択します)
    (7)「OK」ボタンをクリックします。
    ターゲットなし
  4. 「OK」ボタンをクリックします。
    OK
  5. 文字列の下に下線が付きました。
    下線
  6. 設定したリンクを解除する場合は、
    (8) リンクが設定している文字列を、右クリックします。
    右クリック



    (9)「ハイパーリンクのプロパティ」をクリックします。
    リンクのプロパティ



    (10)「リンクの解除」ボタンをクリックします
    リンクの解除


文字を太くするには

  1. (1) 太くしたい文字列をドラッグ(範囲選択)し、
    (2) 共通ツールバーの  (太字)ボタンをクリックします。
    太字
  2. 範囲選択した文字列が太くなりました。
    結果太い


画像を挿入するには

  1.  画像を挿入する場所を指定します。
    ここでは【できます!】の【!】の後ろをクリックしてカーソルをだし、エンター(エンター)キーを押します。
    語尾
  2. (1) メニューの「挿入」をクリックし、
    (2)「画像」をポイントし、。
    (3)「ファイルから」をクリックします。
    画像
  3. (4) 画像が保存している場所を指定し、
    (5) 挿入する画像ファイル(ここでは小さい画像)を選択し、
    (6)「挿入」ボタンをクリックします。
    画像選択
  4. (7)【アクセシビリティのプロパティ】ダイアログボックスが表示されます。その画像の説明を「代替テキスト」ボックスに入力し、
    (8)「OK」ボタンをクリックします。
  5. 画像が挿入されました。
    画像挿入


マウスオンで画像を拡大する

  1. 小さい画像と大きい画像を用意しておきます。
    コードビューの内容を一部変更します。

    (1) 貼り付けた画像を選択し、
    (2)「コード」ビューをクリックします。
    コードビュー
  2. 選択したところに色が付いています。この箇所を変更します。
    色が付く
  3. 下の枠内をクリックし、コントロールキー(コントロール)キーを押したまま、A(A)キーを押して全選択します。
  4. 次に コントロール(コントロール)キーを押したまま、C(C)キーを押してコピーします。
  5. メモ帳を起動し、コントロール(コントロール)キーを押したまま、V(V)キーを押して貼り付けします。(余分な情報をカットするのに一時メモ帳に貼り付けます)
    メモ帳に貼り付け
  6. ★変更する所★
    1. 小さい画像のURL同じものが2ヵ所あります)(例:img/omelet-s.jpg)(img/は保存しているフォルダーを示す)
    2. 画像のタイトル(例:オムレツの画像)
    3. 大きい画像のURL(例:img/omelet.jpg)(マウスを載せたときに大きくなる画像)
      の合計4か所です。環境に合わせて変更してください。
  7. 修正したメモ帳です。
    修正したメモ帳


    修正したメモ帳の内容を全選択し、コピーします。
    コピー
  8. Microsoft Expression Web 4に戻り、色が付いている箇所を削除します。
    (<p> </p> タグは残しておきます)
    削除
  9. <p>と</p>の間にあるカーソルが点滅していることを確認し、コントロール(コントロール)キーを押したまま、V(V)キーを押して貼り付けます。
    貼り付け
  10. 貼り付けたら上書き保存します。
    基本操作・3-07.ブラウザーでプレビュー」のページへ進み、動作を確認します。


フッターを設定するには

  1. フッターの文字列の大きさを小さくしてみましょう。
    フッターの文字列をドラッグして選択します。
    フッターを選択
  2. (1)「スタイル」ボックス内をクリックし、
    (2)「見出し5<h5>」をクリックします。
    見出し5
  3. 文字列が小さくなりました。
    中央揃えにしたい場合は、共通ツールバーの「 (中央)」ボタンをクリックします。
    中央揃え
  4. 中央になりました。
    結果中央
  5. 基本操作・3-07.ブラウザーでプレビュー」のページへ進みます。