FC2ブログ
071234567891011121314151617181920212223242526272829303109

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
--------(--) |  スポンサー広告 |  CM(-) | Top▲

HTML事始め 5

画像を配置

テキスト(文字)だけだった記事に画像を配置しましょう。画像は、絵文字の一種と捉えると分かりやすいかと思います。配置する画像がある場所(フォルダー)と画像のファイル名を文章の任意の位置に記入して、ブラウザに表示してもらいます。

正平23年(1368)二代将軍足利義詮、初代鎌倉公方足利基氏の病死を機に、再び鎌倉奪還をと決起します。七千の兵を率いた義宗に、これを鎮圧せんと寄せ来る足利方上杉憲正將・能憲軍六万の兵が沼田の台地で激戦を繰りひろげます。義宗は、この戦いで右眼を矢で射ぬかれ、うつぶし(俯せ)に落馬して戦死。ここに新田氏は実質的に滅びました。
地元の民は、義宗の霊を「うつぶし明神」として祀り、かの地を「うつぶしの森」と称して伝えてます。

白佐波神社本殿
「うつぶしの森」白佐波神社の画像を上の記事に配置します。場所は最後の行の"「うつぶしの森」…"の前です。

地元の民は、義宗の霊を「うつぶし明神」として祀り、かの地
<img src="http:// URI /HTML5_utsubushi.jpg" alt="白佐波神社本殿" style="width: 160px; height: 120px;" />
を「うつぶしの森」と称して伝えてます。


タグは終了タグはありません。src(ソース)属性の値に画像データの保存先を、alt属性に画像が表示されなかった場合の代替文字を記入します。width、heightの値を指定しておくことで、画像が表示それなかった場合に、記事のレイアウトの崩れを防ぐことができます。
さて、行中に画像を配置したレイアウトはブラウザの表示幅によって位置が変わってしまいます。そこで画像は、多くの場合行間に配置されます。タグの前後に改行タグ
を入れてみます。

地元の民は、義宗の霊を「うつぶし明神」として祀り、かの地<br>
<img src="http:// URI /HTML5_utsubushi.jpg" alt="白佐波神社本殿" style="width: 160px; height: 120px;" />
<br>を「うつぶしの森」と称して伝えてます。


文字列、画像、文字列と層を重ねたような、かつてはよく見られたレイアウトです。

2014-05-25(日) |  情弱な翁(PC) Home Page事始め |  コメント(0)  | Top▲
コメントの投稿












管理者にだけ表示を許可する
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。