ホームページ制作鹿児島｜成果をあげるwebマーケティング

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

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

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

『モーニン』

 

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

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


--------------------

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

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

サンプル文字

--------------------

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

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

サンプル文字

--------------------

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

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

--------------------

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

<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>タグはなんかいっぱいあって難しいぞ』

 

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

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


『慣れだな慣れ』

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

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

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

お楽しみに！
 

2010年02月19日

---