» HTMLの基礎 文字・画像をレイアウトしてみよう

HTMLの基礎 文字・画像をレイアウトしてみよう

いやいや、HTML基礎講座も今回で6回目ですねおぱんだ様!

ちょっと!起きてくださいよ!


『モーニン』

 

格好つけましたねおぱんだ様・・・

さて、今回はレイアウトということで、簡単にできるちょっとしたものをご紹介します。

——————–

【テキストを右寄せにしたい】

<p align="right">文字</p>

サンプル文字

——————–

【テキストを中央寄せにしたい】

<p align="center">文字</p>

サンプル文字

——————–

【画像を横2つ並べたい】

<table border="0">
  <tr>
    <td><img alt="おぱんだ様" src="img/panda.jpg" /></td>
    <td><img alt="おぱんだ様" src="img/panda.jpg" /></td>
  </tr>
</table>

おぱんだ様 おぱんだ様

——————–

【画像を横2つ並べて、それぞれにコメントをつけたい】

<table border="0">

<tbody>
<tr>
<td><img alt="おぱんだ様" src="img/panda.jpg" /></td>
<td><img alt="おぱんだ様" src="img/panda.jpg" /></td>
</tr>
<tr>
<td>かっこいいパンダ</td>
<td>すてきなパンダ</td>
</tr>
</tbody>

</table>

おぱんだ様 おぱんだ様
かっこいいパンダ すてきなパンダ

——————–

【画像に回り込みをつけたい】

<img alt="おぱんだ様" align="left" src="img/panda.jpg" />おぱんだ様のHTML基礎講座では、HTML初心者の方に少しでもホームぺージ更新・編集に慣れていただく為に、HTMLタグの基礎をご紹介しております。おぱんだ様と一緒に、少しづつ覚えていきましょう!

<サンプル>

おぱんだ様おぱんだ様のHTML基礎講座では、HTML初心者の方に少しでもホームぺージ更新・編集に慣れていただく為に、HTMLタグの基礎をご紹介しております。おぱんだ様と一緒に、少しづつ覚えていきましょう!

 

 

 

——————–

<table>タグは初めてご紹介しますね。説明をします。

<tr>は行を、<td>はセル内容を意味します。
他に<th>という見出しセルがあります。
<th>はこちらのような見出しと内容が必要な場合に使います。


『<table>タグはなんかいっぱいあって難しいぞ』

 

慣れるまでは難しいかもしれません。

慣れるまでは、編集エディターでテーブルを作り、そこから編集していきましょう。


『慣れだな慣れ』

そうですね。毎日少しづつ、1日ひとつ覚えられたら流石!くらいの気持ちでやりましょう。

さて、今回はここまでです。

次回は『いらないタグを見つけよう』です。

お楽しみに!
 

トップへ戻る