直線上に配置

資料小分類

  • はじめに
  • レイアウトの考え方
  • レイアウトの構造
  • レイアウトコンテナ挿入
  • HTMLタグの初期化
  • メイン
  • ヘッダ
  • ナビ
  • コンテンツ
  • フッタ
  • メニュー準備
  • メニュー
  • 文字入力
  • スタイル設定
  • 画像の用意
  • 外部スタイルシート

資料大分類

  • 問い合わせ
  • 資料トップへ戻る

メニュー作成の準備をする

メニューはリスト(箇条書き)を利用して作成します。

完成例:

  • メニュー作成の準備
  •  
  • ブラウザでの見え方: ナビゲーション作成の準備

❶ [メニュー] と書かれた文字をダブルクリックして選択します。

  • メニューをダブルクリックして選択

➋ メニューの[挿入] → [リスト] → [番号なしリスト] を選択します。

  • 番号なしリストを追加する

➌ 作成されたリスト文字列「メニュー」の文字に「1」を追加します。

  • 「メニュー1」を完成する

❹ キーボードの[Enter]を押して改行し、続いて「メニュー2」と入力します。これをあと2回繰り返して残り2行を入力します。それぞれ文字は「メニュー3」「メニュー4」とします。

  • リスト文字の入力

❺ 文字を入力し終えたら、ダブルクリックして入力した文字「メニュー1」を選択します。

➏ メニューバーの [挿入] → [リンク] を選択します。

  • リンクを挿入する

❼ リンク属性のウィンドウで、[URLへ] タブを選び、URL入力フィールドに半角で 「#」 と直接入力し、[OK] をクリックします。

  • 疑似リンク

❽ 手順❼を繰り返して [メニュー2] ~ [メニュー4] にもリンクを設定します。

❾ [ページ/ソース] タブをクリックしてソースを確認します。

  • 0

❿ [ページ編集] 画面に戻します。

次ページ: メニューのレイアウト作成

直線上に配置

| |