画像を貼ろう(前準備)
やっぱり文字だったり線・表ぐらいでは
ホームページには寂し過ぎる・・・・
あなたならどうしますか?
そう!画像が足りないのです。
鮮やかなホームページには
きれいな画像がたくさん貼られています。
では早速画像の貼り方を勉強しましょー
っとその前に
今回はindex.htmlと画像の2つのファイルを使用するため
フォルダを用意しましょー
フォルダ構成はこんな感じ
sample
L index.html
L img
L sample.png
(一番↓に添付ファイルでおいておきますので参考にしてください)
画像を貼ろう
画像を貼るためには<img>タグを使用します。
例)
<img src="img/sample.png"><BR>
※img/sample.pngはindex.htmlからの画像ファイルへの相対パス(絶対でもOK)
また、属性を変更すれば場所・サイズを変更することが可能です。
例)
<!-- 右に寄せる -->
<img src="img/sample.png" align="right"><BR>
<!-- サイズを幅100 高さ200 に設定する -->
<img src="img/sample.png" width="100" height="200"><BR>
基本的な属性の設定は以下です。
属性 |
概要 |
height |
画像の縦幅を指定します。 |
with |
画像の横幅を指定します。 |
border |
画像周辺の間隔をピクセル単位で指定します。 |
hspace |
画像の左右の空間幅を指定します。 |
vspace |
画像の上下の空間幅を指定します。 |
align |
画像の配置方法を下記から指定します。top middle、bottom、left、right |
border |
画像周辺の間隔をピクセル単位で指定します。 |
page |
画像ファイルの場所を、モジュール相対URIを指定します。 |
pageKey |
画像ファイルの場所が指定してある、メッセージリソースのkeyを指定します。(パスは、モジュール名以降の絶対パスを指定) |
src |
画像ファイルの場所を、アプリケーション名からの絶対パスで指定します。 |
ではやってみてくださいなっ
最終更新:2012年05月02日 09:41