はげちゃんの世界

人々の役に立とうと夢をいだき、夢を追いかけてきた日々

中級講座６

Webページ「蒙古軍撃退の謎」

１２７４年に世界最強とされたモンゴル軍３万の兵が博多湾に攻め寄せ、１２８２年には１４万もの大群で再び押し寄せましたが、二度とも暴風雨で壊滅しました。蒙古軍は神風と呼ばれた暴風雨が撃退したのでしょうか。

１．メインの領域整備

　1-1　情報入力の準備

連続してソースを入力するのでこのページをブラウザに表示させておきます。では、マイドキュメントから「home」フォルダーを開きます。

shasin　　　　７枚の写真保管
　10.html　　　 卑弥呼の謎のページ
　20.html　　　 蒙古軍撃退の謎のページ
　30.html　　　 北海道米の謎のページ
　index.html　　ホームページ（表紙）
　styles.css　　 レイアウト用

「02.html」のファイルをダブルクリックで開きます。ブラウザ画面に、スタイルシートでレイアウトされた画像が表示され、ブラウザ上段余白に「はげちゃんの世界」と並んで「日本史の謎」という「タブ」が表示されています。

スタイルシートでレイアウトしたようにバックグランドの色は「赤」、帯は「紫」、表題部分に「shasin」ホルダーに保管した「00_00.jpg」の写真が表示されています。このような状態に表示されなければ、スタイルシートのどこかに間違いがあります。慎重に再確認しましょう。

ソースを確認するときには「home」フォルダーの「02.html」を右クリックし、「プログラムから開く」の「CresentEve」をクリックするとエディタが起動して「ソース」が表示されます。

Windows１０で作成している場合は「日本史の謎」が表示されている画面の何もないところをポイントしてソースを表示させると、画面の下部に「ソース」が表示されますが、これは使い方が難しいので前記の方法で確認してください。

トップへ戻る

　1-2　情報入力領域の確認

「中級講座３」で紹介したソースの情報を入力する位置は、「<div id="main">」の第一グループから第五グループまでが本文です。

<div id="main">
<article id="content">
<section>
<h1">◆</h1>
<h2 id="site01">◆</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>
<section>
<h2 id="site02">◆</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>
<section>
<h2 id="site03">◆</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>
<section>
<h2 id="site04">◆</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>
<section>
<h2 id="site05">◆</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>
</article>

トップへ戻る

　1-3　表題の入力

第一グループの「<h1 id="site01">◆</h1>」に表題を入力します。表題は「蒙古軍撃退の謎」とします。表題を左クリックしながらコピーして「◆」の位置にペーストしましょう。

<div id="main">
<article id="content">
<section>
<h1 id="site01">蒙古軍撃退の謎</h1>

トップへ戻る

　1-4　グループの見出し

情報のグループは５つあります。それぞれに見出しを付けます。第一グループは「蒙古の騎馬軍団」、第二グループは「朝鮮半島の支配」第三グループは「蒙古軍来る」第四グループは「史上まれな大軍勢」、第五グループは「鎌倉幕府の衰退」です。

第一グループ　　<h2 id="site02">蒙古の騎馬軍団</h2>

第二グループ　　<h2 id="site03">朝鮮半島の支配</h2>

第三グループ　　<h2 id="site04">蒙古軍来る</h2>

第四グループ　　<h2 id="site05">史上まれな大軍勢</h2>

第五グループ　　<h2 id="site06">鎌倉幕府の衰退</h2>

コピー＆ペーストが終わったら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。

トップへ戻る

２．第一グループの整備

　2-1　一行目の入力

第一グループの一行目「蒙古の騎馬軍団」の本文を入力します。入力する箇所は五行あり、上から一行ずつ入力していきます。まず、「一行目の文章」を読んで、太文字部分を左クリックしながらコピーします。

★一行目の文章
１３世紀のユーラシア大陸の大部分を征服し、世界最強で無敵とされた蒙古軍は騎馬軍団でした。騎馬軍団が猛烈な勢いで攻め込めば逃げるところなどありません。蒙古の騎馬軍団に侵略される側の恐怖は察するに余りあり、すべてが焼き払われて虐殺と強奪が行われました。

一行目の「<p>◆</p>」の「◆」を選択してペーストすると､「before」と「after」は次のようになります。

<div id="main">
<article id="content">
<section>
<h1 id="site01">蒙古軍撃退の謎</h1>
<h2 id="site02">蒙古の騎馬軍団</h2>
<p>◆</p>

<div id="main">
<article id="content">
<section>
<h1 id="site01">蒙古軍撃退の謎</h1>
<h2 id="site02">蒙古の騎馬軍団</h2>
<p>１３世紀のユーラシア大陸の大部分を征服し、世界最強で無敵とされた蒙古軍は騎馬軍団でした。騎馬軍団が猛烈な勢いで攻め込めば逃げるところなどありません。蒙古の騎馬軍団に侵略される側の恐怖は察するに余りあり、すべてが焼き払われて虐殺と強奪が行われました。</p>

トップへ戻る

　2-2　二行目の入力

★二行目の文章
蒙古人や中国人は馬や牛を去勢して動力としていました。生まれたままの牛馬は攻撃的な性質を備えているため、温和な性質に変えるため手術により雄は睾丸を雌は卵巣を摘出しました。牛馬は去勢されると性質が穏やかとなり管理が容易になるそうです。

太文字部分をコピーして二行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>蒙古人や中国人は馬や牛を去勢して動力としていました。生まれたままの牛馬は攻撃的な性質を備えているため、温和な性質に変えるため手術により雄は睾丸を雌は卵巣を摘出しました。牛馬は去勢されると性質が穏やかとなり管理が容易になるそうです。</p>

トップへ戻る

　2-3　三行目の入力

★三行目の文章
蒙古の騎馬軍団は１人の騎手が７～８頭の馬を連れています。１日に７０～８０キロを移動するため、移動や戦闘で乗りつぶすと予備の馬が必要になります。軽快に戦場を疾走して雨あられと矢を射かけ、あっという間に去るという戦法を採っていたのが蒙古騎馬軍団の特色でした。

太文字部分をコピーして三行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>蒙古の騎馬軍団は１人の騎手が７～８頭の馬を連れています。１日に７０～８０キロを移動するため、移動や戦闘で乗りつぶすと予備の馬が必要になります。軽快に戦場を疾走して雨あられと矢を射かけ、あっという間に去るという戦法を採っていたのが蒙古騎馬軍団の特色でした。</p>

トップへ戻る

　2-4　四行目の入力

★四行目の文章
馬の食料は草原に自生しているので運搬する必要はなく、兵は武器と羊の肉を乾燥させて脂肪分を抜いた携帯食を身に着けていました。これが蒙古軍の長期遠征を可能にしたと言われています。

太文字部分をコピーして四行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>馬の食料は草原に自生しているので運搬する必要はなく、兵は武器と羊の肉を乾燥させて脂肪分を抜いた携帯食を身に着けていました。これが蒙古軍の長期遠征を可能にしたと言われています。</p>

トップへ戻る

　2-5　五行目の入力

★五行目の文章
馮天瑜の「絵画中華文明史」には、横一列に１１頭の牛が前後２列に並んでジンギスカンの指令所であるパオを引き、周囲には騎馬軍団が槍を持ち整然と進軍しているようすが描かれています。漢民族が万里の長城を建造した理由はこの騎馬民族への恐怖でした。

太文字部分をコピーして五行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>馮天瑜の「絵画中華文明史」には、横一列に１１頭の牛が前後２列に並んでジンギスカンの指令所であるパオを引き、周囲には騎馬軍団が槍を持ち整然と進軍しているようすが描かれています。漢民族が万里の長城を建造した理由はこの騎馬民族への恐怖でした。</p>

すべてのコピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

３．第二グループの整備

　3-1　一行目の入力

第二グループの一行目「朝鮮半島の支配」の本文を入力します。入力する箇所は五行あり、上から一行ずつ入力していきます。まず、「一行目の文章」を読んで、太文字部分を左クリックしながらコピーします。

★一行目の文章
中国を制覇した蒙古軍は高麗へ侵攻し、抵抗したり反乱を起こした場合は大虐殺を行いました。高麗王は蒙古帝国の支配下に入り、蒙古軍は朝鮮半島に征東行省を置いて政治と軍事を統括しました。前漢や後漢に征服された後に、朝鮮半島を統一した高麗を植民地として支配することで朝鮮半島を掌中にしました。

一行目の「<p>◆</p>」の「◆」を選択してペーストすると､「before」と「after」は次のようになります。

<h2 id="site03">朝鮮半島の支配</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

<h2 id="site03">朝鮮半島の支配</h2>
<p>中国を制覇した蒙古軍は高麗へ侵攻し、抵抗したり反乱を起こした場合は大虐殺を行いました。高麗王は蒙古帝国の支配下に入り、蒙古軍は朝鮮半島に征東行省を置いて政治と軍事を統括しました。前漢や後漢に征服された後に、朝鮮半島を統一した高麗を植民地として支配することで朝鮮半島を掌中にしました。</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

トップへ戻る

　3-2　二行目の入力

★二行目の文章
高麗王は名ばかりで決定権はなく、三代の高麗王が退位させられ、王族の名や服装、髪型などもすべて蒙古風に改められました。経済的には多くの貢物を強要され、受けた打撃を回復させることはできず国庫は常に空でした。しかも両家出身で美人の貢女を強要され続けました。

太文字部分をコピーして二行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>高麗王は名ばかりで決定権はなく、三代の高麗王が退位させられ、王族の名や服装、髪型などもすべて蒙古風に改められました。経済的には多くの貢物を強要され、受けた打撃を回復させることはできず国庫は常に空でした。しかも両家出身で美人の貢女を強要され続けました。</p>

トップへ戻る

　3-3　三行目の入力

★三行目の文章
フビライ・ハンは高麗に日本との交渉役を命じ、九州の太宰府に届けられた高麗王の書簡に「蒙古帝国は朝貢を期待せず、返事をすれば厚く礼する」とありました。フビライ・ハンの国書には「天皇を皇帝の下に置き、返事がなければ兵を用いる」とありました。

太文字部分をコピーして三行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>フビライ・ハンは高麗に日本との交渉役を命じ、九州の太宰府に届けられた高麗王の書簡に「蒙古帝国は朝貢を期待せず、返事をすれば厚く礼する」とありました。フビライ・ハンの国書には「天皇を皇帝の下に置き、返事がなければ兵を用いる」とありました。</p>

トップへ戻る

　3-4　四行目の入力

★四行目の文章
フビライ・ハンは高麗を窓口にして日本に三度も臣下を求める使者を送りましたが、天皇を皇帝の下において返書を要求したことなどにより、鎌倉幕府の執権であった北条時宗はこれを拒否して使者を追い返しました。

太文字部分をコピーして四行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>フビライ・ハンは高麗を窓口にして日本に三度も臣下を求める使者を送りましたが、天皇を皇帝の下において返書を要求したことなどにより、鎌倉幕府の執権であった北条時宗はこれを拒否して使者を追い返しました。</p>

トップへ戻る

　3-5　五行目の入力

★五行目の文章
１２７４年に高麗を出発した蒙古軍２万人と高麗軍６千人の連合軍は、大型船３百隻、小型高速船３百隻、輸送船３百隻に分乗して対馬と壱岐に侵攻しました。２万６千人の兵が９百隻に分乗すると１隻当たり２９名弱となりますが、騎馬軍団は１人の騎手に７～８頭の馬が必要だったのです。

太文字部分をコピーして五行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>１２７４年に高麗を出発した蒙古軍２万人と高麗軍６千人の連合軍は、大型船３百隻、小型高速船３百隻、輸送船３百隻に分乗して対馬と壱岐に侵攻しました。２万６千人の兵が９百隻に分乗すると１隻当たり２９名弱となりますが、騎馬軍団は１人の騎手に７～８頭の馬が必要だったのです。</p>

すべてのコピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

４．第三グループの整備

　4-1　一行目の入力

第第三グループの一行目「蒙古軍来る」の本文を入力します。入力する箇所は五行あり、上から一行ずつ入力していきます。まず、「一行目の文章」を読んで、太文字部分を左クリックしながらコピーします。

★一行目の文章
日本人は牛や馬に名前を与えて家族同様に扱ってきました。大陸から去勢の技術が渡来しても、家族を去勢することなどできるはずがありません。人込みのなかで去勢しない牛が車をひくのは危険なため、平安時代の絵巻に牛車を曳く牛が暴走しないよう取り囲んでいる様子が描かれています。

一行目の「<p>◆</p>」の「◆」を選択してペーストすると､「before」と「after」は次のようになります。

<h2 id="site03">蒙古軍来る</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

<h2 id="site03">蒙古軍来る</h2>
<p>日本人は牛や馬に名前を与えて家族同様に扱ってきました。大陸から去勢の技術が渡来しても、家族を去勢することなどできるはずがありません。人込みのなかで去勢しない牛が車をひくのは危険なため、平安時代の絵巻に牛車を曳く牛が暴走しないよう取り囲んでいる様子が描かれています。</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

トップへ戻る

　4-2　二行目の入力

★二行目の文章
しかし、去勢されていない粗暴な馬を武士たちは合戦の時に乗りこなしていました。源平合戦で義経は一の谷の合戦や屋島の合戦で騎馬隊を組織し、替えの馬を乗り換えながら背後に回り込んで平家軍を破りました。但し、映画に出てくるようなサラブレッドではなく、体長１２０ｃｍしかない木曽馬や野間馬でした。

太文字部分をコピーして二行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>しかし、去勢されていない粗暴な馬を武士たちは合戦の時に乗りこなしていました。源平合戦で義経は一の谷の合戦や屋島の合戦で騎馬隊を組織し、替えの馬を乗り換えながら背後に回り込んで平家軍を破りました。但し、映画に出てくるようなサラブレッドではなく、体長１２０ｃｍしかない木曽馬や野間馬でした。</p>

トップへ戻る

　4-3　三行目の入力

★三行目の文章
１２７４年１０月５日、蒙古と高麗の連合軍は対馬に上陸を開始しました。対馬の民家をことごとく焼き払い、略奪の限りを尽くして壱岐へ向かいました。壱岐では民間人を虐殺して女性は手に穴をあけて紐を通し、数珠つなぎにして船の側面にぶらさげて見せしめと矢よけにしました。高麗軍は傍観していただけではなく、高麗の資料に「日本で生け捕りにした子どもの男女２００人を国王に献上した」と記録されています。

太文字部分をコピーして三行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>１２７４年１０月５日、蒙古と高麗の連合軍は対馬に上陸を開始しました。対馬の民家をことごとく焼き払い、略奪の限りを尽くして壱岐へ向かいました。壱岐では民間人を虐殺して女性は手に穴をあけて紐を通し、数珠つなぎにして船の側面にぶらさげて見せしめと矢よけにしました。高麗軍は傍観していただけではなく、高麗の資料に「日本で生け捕りにした子どもの男女２００人を国王に献上した」と記録されています。</p>

トップへ戻る

　4-4　四行目の入力

★四行目の文章
１０月２０日の未明、対馬から壱岐を経た蒙古と高麗の連合軍が博多湾に上陸すると、牛馬と騎馬軍団が縦横無尽に走り回れる大地はありません。草原と土漠が延々と続くモンゴルとは異なり、起伏の激しい丘と山に草木が茂っていました。日本側は毒矢と火薬などの攻撃でかなりの苦戦を強いられましたが、丘や木陰からの御家人の攻撃に加え動力を使えない蒙古軍は途方にくれました。

太文字部分をコピーして四行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>１０月２０日の未明、対馬から壱岐を経た蒙古と高麗の連合軍が博多湾に上陸すると、牛馬と騎馬軍団が縦横無尽に走り回れる大地はありません。草原と土漠が延々と続くモンゴルとは異なり、起伏の激しい丘と山に草木が茂っていました。日本側は毒矢と火薬などの攻撃でかなりの苦戦を強いられましたが、丘や木陰からの御家人の攻撃に加え動力を使えない蒙古軍は途方にくれました。</p>

トップへ戻る

　4-5　五行目の入力

★五行目の文章
蒙古軍の矢が尽きて副将のリュウフクコウが負傷し、総大将のヒンドゥが撤退を決意しました。蒙古は乾燥地帯のため蚊がいませんが、やぶ蚊を避けるために船から下りなかったことも災いしました。高麗で急造された粗悪なつくりの軍船は壊れ始め、３割に当たる１３，５００人が溺死しました。指揮官たちの船は無事に朝鮮半島へ戻れましたが、博多の岸に泳ぎ着いた蒙古人は切り殺され、高麗人は助けられました。

太文字部分をコピーして五行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>蒙古軍の矢が尽きて副将のリュウフクコウが負傷し、総大将のヒンドゥが撤退を決意しました。蒙古は乾燥地帯のため蚊がいませんが、やぶ蚊を避けるために船から下りなかったことも災いしました。高麗で急造された粗悪なつくりの軍船は壊れ始め、３割に当たる１３，５００人が溺死しました。指揮官たちの船は無事に朝鮮半島へ戻れましたが、博多の岸に泳ぎ着いた蒙古人は切り殺され、高麗人は助けられました。</p>

すべてのコピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

５．第四グループの整備

　5-1　一行目の入力

第四グループの一行目「史上まれな大軍勢」の本文を入力します。入力する箇所は五行あり、上から一行ずつ入力していきます。まず、「一行目の文章」を読んで、太文字部分を左クリックしながらコピーします。

★一行目の文章
高麗史日本伝によると、第一次侵攻に失敗した後に高麗の忠列王は「日本はただ野蛮な国でありながら、交通の難しいのを良いことに元朝に来貢せず、あえて皇帝の軍隊に抵抗しています。私が思いますに元朝の徳に報いることはありません。この際、船を作り食料を貯め、罪を強調して討伐しようと思います」とフビライを扇動したそうです。

一行目の「<p>◆</p>」の「◆」を選択してペーストすると､「before」と「after」は次のようになります。

<h2 id="site03">史上まれな大軍勢</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

<h2 id="site03">史上まれな大軍勢</h2>
<p></p>
<p>高麗史日本伝によると、第一次侵攻に失敗した後に高麗の忠列王は「日本はただ野蛮な国でありながら、交通の難しいのを良いことに元朝に来貢せず、あえて皇帝の軍隊に抵抗しています。私が思いますに元朝の徳に報いることはありません。この際、船を作り食料を貯め、罪を強調して討伐しようと思います」とフビライを扇動したそうです。</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

トップへ戻る

　5-2　二行目の入力

★二行目の文章
フビライは無条件降伏した大量の南宋兵を日本へ向かわせることにしました。蒙古と高麗の連合軍は二手に分かれ、東路軍は４万人が９千隻の船団で、江南軍は１０万人が３千５百隻の船団を組み、両軍を合わせて総勢１４万人、１万２千５百隻という世界史上まれにみる大軍勢を整えました。

太文字部分をコピーして二行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>フビライは無条件降伏した大量の南宋兵を日本へ向かわせることにしました。蒙古と高麗の連合軍は二手に分かれ、東路軍は４万人が９千隻の船団で、江南軍は１０万人が３千５百隻の船団を組み、両軍を合わせて総勢１４万人、１万２千５百隻という世界史上まれにみる大軍勢を整えました。</p>

トップへ戻る

　5-3　三行目の入力

★三行目の文章
対馬と壱岐では家族を惨殺された海賊の松浦党が中心となり、夜襲と奇襲を繰り返して戦力を消耗させました。また、蒙古軍に反旗を翻した高麗軍の一部が、蒙古軍の船を襲ったり焼き払ったこともあったようです。夏の真っ盛りですから軍船内は蒸し風呂のようになり、食料は腐敗して伝染病が発生し、死者は３千人にも上りました。

太文字部分をコピーして三行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>対馬と壱岐では家族を惨殺された海賊の松浦党が中心となり、夜襲と奇襲を繰り返して戦力を消耗させました。また、蒙古軍に反旗を翻した高麗軍の一部が、蒙古軍の船を襲ったり焼き払ったこともあったようです。夏の真っ盛りですから軍船内は蒸し風呂のようになり、食料は腐敗して伝染病が発生し、死者は３千人にも上りました。</p>

トップへ戻る

　5-4　四行目の入力

★四行目の文章
１２７４年の第一次侵攻を食い止めた鎌倉幕府は本格的な異国警固に乗り出し、博多湾に海側を切り立たせて陸側に傾斜を付けた防塁を築造させました。防塁は２・６メートルの高さで幅３．１メートル、福岡市西区今津から福岡市東区香椎まで約２０キロメートという長さでした。

太文字部分をコピーして四行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>１２７４年の第一次侵攻を食い止めた鎌倉幕府は本格的な異国警固に乗り出し、博多湾に海側を切り立たせて陸側に傾斜を付けた防塁を築造させました。防塁は２・６メートルの高さで幅３．１メートル、福岡市西区今津から福岡市東区香椎まで約２０キロメートという長さでした。</p>

トップへ戻る

　5-5　五行目の入力

★五行目の文章
防塁は一部しか完成していませんが、御家人の活躍で戦いは一進一退を繰り返しました。遊牧民族の蒙古軍は海戦の戦い方を知らずに船と船を鎖でつなぎ、やぶ蚊を避けて夜は船に戻りました。１２８１年７月１日、博多湾を台風が襲いました。「元史」には、「１０のうち生きて帰ったものは２、３しかいない」との記述がみられます。

太文字部分をコピーして五行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>防塁は一部しか完成していませんが、御家人の活躍で戦いは一進一退を繰り返しました。遊牧民族の蒙古軍は海戦の戦い方を知らずに船と船を鎖でつなぎ、やぶ蚊を避けて夜は船に戻りました。１２８１年７月１日、博多湾を台風が襲いました。「元史」には、「１０のうち生きて帰ったものは２、３しかいない」との記述がみられます。</p>

すべてのコピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

６．第五グループの整備

　6-1　一行目の入力

第五グループの一行目「鎌倉幕府の衰退」の本文を入力します。入力する箇所は五行あり、上から一行ずつ入力していきます。まず、「一行目の文章」を読んで、太文字部分を左クリックしながらコピーします。

★一行目の文章
大暴風雨に襲われた１４万人の大船団のほとんどが海の藻屑と消えました。溺死を免れた兵は容赦なく切られ、前回の壱岐と対馬の残虐行為の報いで高麗人も切り捨てられました。この大敗北に続いて、ベトナムやインドへの侵攻に失敗して求心力を失ったフビライは１２９４年に没しました。

一行目の「<p>◆</p>」の「◆」を選択してペーストすると､「before」と「after」は次のようになります。

<h2 id="site03">鎌倉幕府の衰退</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

<h2 id="site03">鎌倉幕府の衰退</h2>
<p>大暴風雨に襲われた１４万人の大船団のほとんどが海の藻屑と消えました。溺死を免れた兵は容赦なく切られ、前回の壱岐と対馬の残虐行為の報いで高麗人も切り捨てられました。この大敗北に続いて、ベトナムやインドへの侵攻に失敗して求心力を失ったフビライは１２９４年に没しました。</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

トップへ戻る

　6-2　二行目の入力

★二行目の文章
昭和の教科書では次のように説明されています。「元は、１２７４年（文永の役）と、１２８１年（弘安の役）との２度にわたり大軍を送って北九州へ攻めてきた。（略）さいわい２度とも暴風が襲い、元軍は全滅に近い打撃を受けて退いた。これを元寇と言う。」

太文字部分をコピーして二行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>昭和の教科書では次のように説明されています。「元は、１２７４年（文永の役）と、１２８１年（弘安の役）との２度にわたり大軍を送って北九州へ攻めてきた。（略）さいわい２度とも暴風が襲い、元軍は全滅に近い打撃を受けて退いた。これを元寇と言う。」</p>

トップへ戻る

　6-3　三行目の入力

★三行目の文章
平成の教科書では次のように説明されています。「フビライは日本を従えようと（略）高麗の軍勢をも合わせて攻め入ってきました。１２７４（文永１１）年には、対馬・壱岐を経て北九州の博多湾に上陸し、集団戦法と優れた火器により、日本軍を悩ましたすえ引き上げました（文永の役）。１２８１（弘安４）年には、再び攻めてきましたが、（略）元の大群は上陸できないまま、暴風にあって大損害を受け、退きました（弘安の役）」。

太文字部分をコピーして三行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>平成の教科書では次のように説明されています。「フビライは日本を従えようと（略）高麗の軍勢をも合わせて攻め入ってきました。１２７４（文永１１）年には、対馬・壱岐を経て北九州の博多湾に上陸し、集団戦法と優れた火器により、日本軍を悩ましたすえ引き上げました（文永の役）。１２８１（弘安４）年には、再び攻めてきましたが、（略）元の大群は上陸できないまま、暴風にあって大損害を受け、退きました（弘安の役）」。</p>

トップへ戻る

　6-4　四行目の入力

★四行目の文章
モンゴルと高麗の連合軍が大敗した後、鎌倉幕府の執権北条時宗は戦で命を落とした武士を弔うため、鎌倉市に無学祖元を開祖として円覚寺を建立しました。そして、この戦いの殉職者を敵味方の分け隔てなく平等に弔いました。

太文字部分をコピーして四行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>モンゴルと高麗の連合軍が大敗した後、鎌倉幕府の執権北条時宗は戦で命を落とした武士を弔うため、鎌倉市に無学祖元を開祖として円覚寺を建立しました。そして、この戦いの殉職者を敵味方の分け隔てなく平等に弔いました。</p>

トップへ戻る

　6-5　五行目の入力

★五行目の文章
蒙古軍との戦いは防衛戦争のため、戦いに勝って自分たちの領土を守りましたが敵の領土が手に入ったわけではありません。当時の御家人たちは戦いの費用はすべて自腹が基本でした。幕府は自腹を切って戦った御家人たちに、働きに応じた恩賞を出せなかったのです。御家人たちは経済的に困窮し、鎌倉幕府との信頼関係を失っていきました。

太文字部分をコピーして五行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>蒙古軍との戦いは防衛戦争のため、戦いに勝って自分たちの領土を守りましたが敵の領土が手に入ったわけではありません。当時の御家人たちは戦いの費用はすべて自腹が基本でした。幕府は自腹を切って戦った御家人たちに、働きに応じた恩賞を出せなかったのです。御家人たちは経済的に困窮し、鎌倉幕府との信頼関係を失っていきました。</p>

すべてのコピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

７．第六グループの整備

　7-1　一行目の入力

第六グループの一行目「推理の根拠資料」の本文を入力します。入力する箇所は五行あり、上から一行ずつ入力していきます。まず、「一行目の文章」を読んで、太文字部分を左クリックしながらコピーします。

★一行目の文章
「八幡愚童訓」によると、蒙古軍は太鼓をたたいて銅鑼を打ち、花火や鉄砲を鳴らして鬨の声を上げていたそうです。しかし、鉄砲は種子島に伝わったものと異なり、お椀の形をした鉄製の容器を二つ合わせてボール状にし、中に火薬を詰め導火線に火をつけて投石器で日本の陣へ投げ込みました。草原と土漠が延々と続く大陸で効果があっても、草木が茂る地域ではあまり効果はなかったでしょう。

一行目の「<p>◆</p>」の「◆」を選択してペーストすると､「before」と「after」は次のようになります。

<h2 id="site03">推理の根拠資料</h2>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

<h2 id="site03">推理の根拠資料</h2>
<p>「八幡愚童訓」によると、蒙古軍は太鼓をたたいて銅鑼を打ち、花火や鉄砲を鳴らして鬨の声を上げていたそうです。しかし、鉄砲は種子島に伝わったものと異なり、お椀の形をした鉄製の容器を二つ合わせてボール状にし、中に火薬を詰め導火線に火をつけて投石器で日本の陣へ投げ込みました。草原と土漠が延々と続く大陸で効果があっても、草木が茂る地域ではあまり効果はなかったでしょう。</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

トップへ戻る

　7-2　二行目の入力

★二行目の文章
博多に上陸した騎馬軍は戦場を疾走して雨あられと矢を射かけ、あっという間に去るという戦法を採ることは不可能でした。雑木林の間に開けた地は田畑であり、第一回の侵攻時に稲の刈り取りは終わっていても、あぜ道や用水路が障害となり疾走することは不可能です。弓を射ても、雑木林や雑草が障害となりそれほどの効果はなかったでしょう。

太文字部分をコピーして二行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>博多に上陸した騎馬軍は戦場を疾走して雨あられと矢を射かけ、あっという間に去るという戦法を採ることは不可能でした。雑木林の間に開けた地は田畑であり、第一回の侵攻時に稲の刈り取りは終わっていても、あぜ道や用水路が障害となり疾走することは不可能です。弓を射ても、雑木林や雑草が障害となりそれほどの効果はなかったでしょう。</p>

トップへ戻る

　7-3　三行目の入力

★三行目の文章
「元史」には、第一回侵攻の際に暴風雨に遭遇の記載がなく、撤退の理由を官軍が整わず矢が尽きてしまったことによるとしています。しかし、「高麗史」や「東国通艦」などの朝鮮側の資料に、「夜大風雨があい、選管は弾劾にふれて大沓はした」と記録され、水に落ちて死んだ将の名前が挙げられていますが、風雨はあったとしても撤退の理由ではなかったようです。

太文字部分をコピーして三行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>「元史」には、第一回侵攻の際に暴風雨に遭遇の記載がなく、撤退の理由を官軍が整わず矢が尽きてしまったことによるとしています。しかし、「高麗史」や「東国通艦」などの朝鮮側の資料に、「夜大風雨があい、選管は弾劾にふれて大沓はした」と記録され、水に落ちて死んだ将の名前が挙げられていますが、風雨はあったとしても撤退の理由ではなかったようです。</p>

トップへ戻る

　7-4　四行目の入力

★四行目の文章
二回目の侵攻は６月末のため、水田に水が満たされていました。平らな土地でも水はけの悪い土地は放置されていました。起伏の激しい丘や山の雑木林は行く手を阻みます。モンゴル軍が上陸しても動きは制限され、思うような戦術は組めなかったでしょう。あなたの参考になりそうな資料をご紹介します。

太文字部分をコピーして四行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>二回目の侵攻は６月末のため、水田に水が満たされていました。平らな土地でも水はけの悪い土地は放置されていました。起伏の激しい丘や山の雑木林は行く手を阻みます。モンゴル軍が上陸しても動きは制限され、思うような戦術は組めなかったでしょう。あなたの参考になりそうな資料をご紹介します。</p>

トップへ戻る

　7-5　五行目の入力

★五行目の文章
学校では教えてくれない日本史の授業・悪人英雄論（井沢元彦、ＰＨＰ研究所）、日本史の謎は「地形」で解ける（竹村公太郎、ＰＨＰ研究所）、歴史の意外な結末（日本博学倶楽部、ＰＨＰ研究所）、日本史「その後」の謎（雑学総研、株式会社KADOKAWA）、こんなに変わった歴史教科書（山本博文ほか、新潮社）、小中学校の「日本史」を２０場面で完全理解（向山洋一編、ＰＨＰ研究所）。

太文字部分をコピーして五行目の「<p>◆</p>」の「◆」を選択してペーストすると､「after」は次のようになります。

<p>学校では教えてくれない日本史の授業・悪人英雄論（井沢元彦、ＰＨＰ研究所）、日本史の謎は「地形」で解ける（竹村公太郎、ＰＨＰ研究所）、歴史の意外な結末（日本博学倶楽部、ＰＨＰ研究所）、日本史「その後」の謎（雑学総研、株式会社KADOKAWA）、こんなに変わった歴史教科書（山本博文ほか、新潮社）、小中学校の「日本史」を２０場面で完全理解（向山洋一編、ＰＨＰ研究所）。</p>

すべてのコピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

８　目次の作成

　8-1　目次の準備

サイドバーに「目次」を作ります。「<li><a href="#site04">◆</a></li>」をコピーし、「Enter」キーを１度押してペーストしたのち、「04」を「05」に修正すると「before」と「after」は次のようになります。

<aside id="sidebar">
<h3><strong>目次</strong></h3>
<ul>
<li><a href="#site01">◆</a></li>
<li><a href="#site02">◆</a></li>
<li><a href="#site03">◆</a></li>
<li><a href="#site04">◆</a></li>
</ul>

<aside id="sidebar">
<h3><strong>目次</strong></h3>
<ul>
<li><a href="#site01">◆</a></li>
<li><a href="#site02">◆</a></li>
<li><a href="#site03">◆</a></li>
<li><a href="#site04">◆</a></li>
<li><a href="#site05">◆</a></li>
</ul>

コピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

　8-2　目次の整備

目次となる「◆」に上から順に「蒙古の騎馬軍団々」「朝鮮半島の支配」「蒙古軍来る」「史上まれな大軍勢」「鎌倉幕府の衰退」をコピーしてペーストすると「before」と「after」は次のようになります。

<aside id="sidebar">
<h3><strong>目次</strong></h3>
<ul>
<li><a href="#site01">◆</a></li>
<li><a href="#site02">◆</a></li>
<li><a href="#site03">◆</a></li>
<li><a href="#site04">◆</a></li>
<li><a href="#site05">◆</a></li>
</ul>

<aside id="sidebar">
<h3><strong>目次</strong></h3>
<ul>
<li><a href="#site01">蒙古の騎馬軍団</a></li>
<li><a href="#site02">朝鮮半島の支配</a></li>
<li><a href="#site03">蒙古軍来る</a></li>
<li><a href="#site04">史上まれな大軍勢</a></li>
<li><a href="#site05">鎌倉幕府の衰退</a></li>
</ul>

コピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

トップへ戻る

９　写真の表示

　9-1　写真の選定

ウエブページに掲載される写真やイラストは、文章の補足をしたり内容の理解を深めさせてくれます。あなたがつくるウエブページ「日本史の謎」に写真を掲載します。他人が撮影した写真や他人が写っている写真は著作権や肖像権があるので、あなたが撮影した風景写真などを利用するのが最善です。

あなたのパソコンに保管されている風景などが写ったデジタル写真（拡張子が「.jpg」の写真）を３枚選択し、その写真のコピーを「home」の「shasin」フォルダーに保管します。写真の縮小方法と掲載方法を覚えるのが目的ですから、写真の選択に時間をかけるのはやめましょう。

適当な写真が見つからない場合は、はげちゃんが撮影した写真を使います。下のリンクボタンをクリックすると４枚の写真が表示されます。説明を読んでからディスクトップにダウンロードしてください。

　　　　　デジタル写真がない方　　⇒　　講座で使用する写真３

トップへ戻る

　9-2　写真を保管する

ダウンロードした写真に名前をつけます。写真をポイントして右クリックし、「名前の変更」を選択します。写真の名前は次のように半角英数で入力してください。

・　騎馬軍団　　　　　　　を　　02_01.jpg　　に変更。

・　夕暮れの海　　　　　　を　　02_02.jpg　　に変更。

・　昼の海　　　　　　　　を　　02_03.jpg　　に変更。

写真を３枚ともディスクトップへダウンロードし終わったら、マイドキュメント内に作成された「home」フォルダーをダブルクリックで開き､「shasin」フォルダーをダブルクリックで開きます。

「Ctrl」キーを押しながら３枚の写真を次々にクリックしてから、「Ctrl」キーを放して「shasin」フォルダー内へドラッグ＆ドロップ（引きずり落と）します。ダイアログがでたときは「移動」をクリックしてください。

「home」の「shasin」フォルダー内に、「02_01.jpg、02_02.jpg、02_03.jpg」と半角英数で名前が付けられた写真が３枚保管されました。

「蒙古の騎馬軍団」の「蒙古軍来る」と「史上まれな大軍勢」の文章の中に写真を挿入します。

トップへ戻る

　9-3　写真の縮小

　　9-3-1　原寸大の確認

タスクバー左端の「スタート」をクリックして「よく使うアプリのスクロールバー」を下ろして、「Windousアクセサリ」内にある「ペイント」ソフトを起動させます。

ペイントソフトの上段メニューバー左端の「ファイル」をクリックして「ファイルを開く」を選択し､「home」の「shasin」をクリックして開きます。｢shasin」フォルダーから「02_01.jpg」写真をクリックして「開く」を選択すると写真が読み込まれます。

メニューの左から二番目のグループにある「サイズの変更」をクリックすると「サイズ変更と傾斜」のダイアログが表示されます。サイズ変更の単位で「ピクセル」をクリックすると、水平方向「６５０」垂直方向「６４８」と表示されます。

中央部分にある「縦横比を維持する」にチェックが入っているのを確認してから、下段の「キャンセル」をクリックし、ペイント画面右上の「×」をクリックして終了します。

トップへ戻る

　　9-3-2　海の写真

タスクバー左端の「スタート」をクリックして「よく使うアプリのスクロールバー」を下ろして、「Windousアクセサリ」内にある「ペイント」ソフトを起動させます。

次に、ペイントソフトの上段メニューバー左端の「ファイル」をクリックして「ファイルを開く」を選択し､「home」の「shasin」をクリックして開きます。｢shasin」フォルダーから「02_02.jpg」写真をクリックして「開く」を選択すると写真が読み込まれます。

メニューの左から二番目のグループにある「サイズの変更」をクリックすると「サイズ変更と傾斜」のダイアログが表示されます。サイズ変更の単位で「ピクセル」をクリックすると、水平方向「５００」垂直方向「３７５」と表示されます。

中央部分にある「縦横比を維持する」にチェックが入っているのを確認してから「水平方向」の窓の数字「５００」を「３００」に修正します。垂直方向は自動的に「３７５」から「２２５」に変更されました。

「ＯＫ」をクリックすると縮小された写真が表示されます。メニューバー左端の「ファイル」をクリックして「上書き保存」をクリックすると、「shasin」の「02_01.jpg」の写真は縮小された状態で上書きされます（入れ替わります）。

同様に、「02_03.jpg」の写真を読み込んで、「水平方向」の窓の数字「５００」を「３００」に修正して「上書き保存」してください。

トップへ戻る

　9-4　大写真の表示

写真を読み込むときは「img」タグを使います。「img」タグに、「写真の保管してある場所、写真の名前、写真の横幅、写真の縦幅、写真を表示しない設定者のために写真の簡単な説明、写真の表示する位置」などのデータを入力します。

文章の間に写真を表示させます。第一グループの「蒙古の騎馬軍団」の３段目の最終部分、「あっという間に去るという戦法を採っていたのが蒙古騎馬軍団の特色でした。」の「</p>」の右側にカーソルを入れて、「Enter」キーを２回押します。

「img」タグに「9-3-1　原寸大の確認」時のデータを入力すると次のようになります。データを入力したイメージタグを左クリックで選択してコピーします。「 class="right"」は省略しました。

<p><img src="shasin/02_01.jpg" width="650" height="648"></p>

エディタの「ソース」で先ほどカーソルを表示させた位置をもう一度クリックしてペーストし、「Enter」キーを１回押します。すると、行間に写真が挿入されます。

コピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。

トップへ戻る

　9-5　左寄りの写真

文章の間に写真を表示させます。第三グループ「蒙古軍来る」３番目、「１２７４年１０月５日」の「冒頭」にカーソルを入れてクリックします。

「img」タグに「9-3-2　海の写真」時のデータを入力すると次のようになります。データを入力したイメージタグを左クリックしながら選択してコピーします。「class="left"」となっていることに注目してください。

<img src="shasin/02_02.jpg" width="300" height="225" class="left">

エディタの「ソース」で先ほどカーソルを表示させた位置をもう一度クリックしてペーストします。すると、写真は文章の左側に表示されます。

コピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。

トップへ戻る

　9-6　右寄りの写真

文章の間に写真を表示させます。第五グループ「史上まれな大軍勢」の４番目、「博多湾に海側を切り立たせて陸側に傾斜を付けた防塁を」の「付けた」と「防塁」の間をクリックしてカーソルを入れます。

「img」タグに「9-2-3　接続用の写真」時のデータを入力すると次のようになります。データを入力したイメージタグを左クリックしながらコピーします。「class="right"」となっていることに注目してください。

<img src="shasin/02_03.jpg" width="310" height="225" class="right">

エディタの「ソース」で先ほどカーソルを表示させた位置をもう一度クリックしてペーストします。すると、次のようになります。

コピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。

トップへ戻る

10　あなたの推理は

いよいよ最終部分となる第七グループに着手します。「あなたの推理」の小見出しを整備して、本文を入力していただきます。小見出しを入力する箇所は五ヶ所で、上から一行ずつ入力していきます。まず、小見出しをコピーしてペーストします。

　10-1　小見出し

第一グループの序文「あなたの推理」の本文を入力します。入力する箇所は五ヶ所で、上から順に入力していきます。まず、第一グループの小見出しをコピーします。

第一グループの小見出し　　<h3>蒙古の騎馬軍団について</h3>

第二グループの小見出し　　<h3>朝鮮半島の支配について</h3>

第三グループの小見出し　　<h3>蒙古軍来るについて</h3>

第四グループの小見出し　　<h3>史上まれな大軍勢について</h3>

第五グループの小見出し　　<h3>鎌倉幕府の衰退について</h3>

一行目の「<h3>・　◆</h3>」の「◆」を選択してペーストすると､「before」と「after」は次のようになります。

<h2 id="site03">あなたの推理</h2>
<h3>・　◆</h3>
<p>◆</p>
<h3>・　◆</h3>
<p>◆</p>
<h3>・　◆</h3>
<p>◆</p>
<h3>・　◆</h3>
<p>◆</p>
<h3>・　◆</h3>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

<h2 id="site03">あなたの推理</h2>
<h3>・　蒙古の騎馬軍団について</h3>
<p>◆</p>
<h3>・　朝鮮半島の支配についてて</h3>
<p>◆</p>
<h3>・　蒙古軍来るについて</h3>
<p>◆</p>
<h3>・　史上まれな大軍勢について</h3>
<p>◆</p>
<h3>・　鎌倉幕府の衰退について</h3>
<p>◆</p>
<p class="top"><a href="◆">トップへ戻る</a></p>
</section>

すべてのコピー＆ペーストが完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。「index.html」をクリックすると下図のようになっています。

メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。

トップへ戻る

　10-2　項目毎のあなたの推理

では、「・　古代の国々について」の直下にある「<p>◆</p>」で「◆」を選択し、あなたのご意見を入力してください。項目は５つあるので、それぞれについてご意見を入力しましょう。

すべて項目への週力が完了したら、メニューバーの「ファイル」から「上書き保存」を選択します。これを忘れると入力した内容は消えてしまいます。

トップへ戻る

　　　　　「 初級講座５ 」　← 　初級講座５　 →　「 初級講座７ 」