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