素人珈琲

< 新しい記事

新着記事一覧(全70件)

過去の記事 >

December 21, 2005

HTML教えます　その２

(1)

テーマ：ホームページ作成の悩み(545)

カテゴリ：ホームページ作成教室

さぁ第2回を迎えました「 HTML教えます 」のお時間です

今回は「 画像とテキスト（文字）の位置調整 」です

HTML	<img src="http://image.jpeg" width="60" height="60">この狸は、自宅の庭に飾ってある置物の狸です。最近、この狸が我が一家でブームなのです。それは、ただの狸にしか見えないこの置物が何と・・・
表示	この狸は、自宅の庭に飾ってある置物の狸です。最近、この狸が我が一家でブームなのです。それは、ただの狸にしか見えないこの置物が何と・・・

上記のようなHTMLを入力しますと、画像とテキストの位置がぐちゃぐちゃになっちゃいます

そこで、この画像を左側か右側に寄せてしまい、テキストを画像の左右に回り込ませます

その方法が <arign="○○"> というタグです
○○には right と left という文字がが入ります

実際に、このタグを使ってみましょう！

HTML	<img src="http://image.jpeg" width="60" height="60" align="left" >この狸は、自宅の庭に飾ってある置物の狸です。最近、この狸が我が一家でブームなのです。それは、ただの狸にしか見えないこの置物が何と・・・
表示	この狸は、自宅の庭に飾ってある置物の狸です。最近、この狸が我が一家でブームなのです。それは、ただの狸にしか見えないこの置物が何と・・・

HTML	<img src="http://image.jpeg" width="60" height="60" align="right" >この狸は、自宅の庭に飾ってある置物の狸です。最近、この狸が我が一家でブームなのです。それは、ただの狸にしか見えないこの置物が何と・・・
表示	この狸は、自宅の庭に飾ってある置物の狸です。最近、この狸が我が一家でブームなのです。それは、ただの狸にしか見えないこの置物が何と・・・