論文をHTML形式に書き換える

画像を表示するには

論文では、Exelなどで作ったグラフや文献から取り込んだ画像をしようすることもあるでしょう。その場合は、<img>を使用します。<img>は画像を表示することで完結するので、</img>と閉じる必要はありません。

<img src="画像の場所" width="画像の幅" height="画像の高さ" alt="代替テキスト">

src="画像の場所"には画像がある場所が入ります。同じフォルダに画像がある場合は「ファイル名」が、別のフォルダにある場合は「フォルダ名/ファイル名」です（詳細は「絶対パスと相対パスについて」を参照）。

width="画像の幅" height="画像の高さ"は、画像の表示したい幅と高さをそれぞれピクセルで入力します。基本的には、画像の本来の幅と高さを入力することになります。画像の幅と高さは、画像のプロパティを参照して下さい。

alt="代替テキスト"は、画像が表示されない、または表示できない場合に、代わりに表示されるテキストを入力します。画像のタイトルで構いませんが、画像の持っている意味や役割、内容を簡単に説明したものを入力するほうがより親切でしょう。何の意味もなく飾りで表示させているだけであれば、何も入力する必要はありません。

<img>は、HTMLのルールでは段落の外にあっても中にあっても構いませんが、段落は文の集まりなので、グラフなどの画像が段落の中に来ることはあり得ない気がします。しかし、細かい話をすると、<img>はインライン要素といって、かたまり（ブロックレベル要素）の中で用いられるものなので、ブロックレベル要素で囲むことが望まれます。ですから、<img>を使用する時は、一応、以下のようにして下さい。

<div><img src="" width="" height="" alt=""></div>

<div></div>はブロックレベルの入れもの的なもので、それ自体は意味を持ちません。<div></div>の中に<img>をいくつ入れても構いません。

表を作成するには

論文では、図のほかに表を使う場合が多くあります。これは、<table></table>を使って作成しますが、はっきり言って簡単に出来るものではありません。時間割のようなものは簡単に出来ますが、いろいろな大きさの枠が入り組んだものを作るとなると、それなりに経験が必要です。個人的にも<table></table>は得意ではないので、かみ砕いて説明することも出来ません。入り組んだ表が必要な場合は、気合で乗り切るか、文章作成ソフトや表計算ソフトで作ったものを画像で取り込んで表示して下さい。

<table summary="内容の説明" border="数字">
<tr>
    <td>内容１</td><td>内容２</td>
</tr>
<tr>
    <td>内容３</td><td>内容４</td>
</tr>
<table>

summary="内容の説明"は表の内容を要約したものを入力します。時間割でしたらsummary="2004年度の時間割"のように入力しておけば問題ないと思われます。 border="数字"は境界線の太さを指定するもので、基本的にデフォルトで境界線は表示しない設定になっているので、境界線が必要ない場合は border="数字"自体、記述する必要はありません。（border="0"と記述することもあります。書き忘れましたが、入力内容が数字の場合は半角文字です。）

<tr></tr>は表の行をあらわします。<td></td>は表の列で、<tr></tr>の中に入り、この中に入力した文字が項目として表示されます。上の例の場合、一列目に内容１と内容２が、二列目に内容３と内容４が表示されます。

細かくは説明しきれないので、近くにあった表のサンプルを書いておきます。colspan="数字"は数字マス分だけ横に、rowspan="数字"は数字マス分だけ縦に広がります。

<table summary="荷物の配置先の記入表" border="1">
<tr>
    <td rowspan="2">転入側</td><td>階名</td><td colspan="2">所属名</td>
</tr>
<tr>
    <td>２階</td><td colspan="2">洋室</td>
</tr>
<tr>
    <td colspan="2">レイアウト No.</td><td colspan="2">担当者</td>
</tr>
<tr>
    <td colspan="2">未定</td><td colspan="2">未定</td>
</tr>
<tr>
    <td>備考</td><td>特になし</td><td>色番</td><td>5 緑</td>
</tr>
</table>

一応、以下のように表示されます。とても分かりづらい表になっていますが、レイアウトを行っていないためで、スタイルシートを使えば文字を強調したり色を着けたりできるので、かなり違って見えます。

前のページへ　次のページへ

Back to Index