今日は、ホームページって実はこんなタグの集まりで出来ているんだよ～ということで、画像を表示するタグ<img>をやりました。
前回、文字を表示するタグ<font>をやったので、その続き。
前回やったのは、メモ帳に
<font >あいうえお</font>
と書いて、名前を付けて保存し、IEで開いて見るということでした。
<font>が文字を表示しなさい、という命令でその後に書かれた文字を表示して</font>が、文字の設定終わりの合図です。とても簡単ですぐに理解していただけました。
でもこれだけだと、黒い文字で「あいうえお」が表示されるだけなので、ここに文字の大きさと色を付けてみました。
<font size=20 color=#ff0000>あいうえお</font>
size= ←ここで文字の大きさを指定します
color= ←ここで文字の色ですね。前回は、redやblueなどを入れて色を変えてやってみました。
今回は、もっと複雑な色が出せるように、きちんとRGBで書きました。
ff ←これは16進数で16かける16、つまり10進法に直すと256です。
#ffffff ←これは、R ←REDが256 G ←GREENが256 B ←Blueが256で、白になります。
逆に
#000000 ←これは、R G B 全てが0で暗闇、黒になります。
R G B それぞれの数が多くなればなるほど、薄い色になるってことですね。
さて、本題の絶対値と相対値ですが、画像を表示してみます。
<img src=”https://chishikinoizumi.net/test/n_shop.gif”>
これが絶対値です。表示したい画像ファイルは、
https://chishikinoizumi.net/test/というネット上の場所に置いてある n_shop.gif というファイルです。
<img src=”n_shop.gif”>
こちらが、相対値です。画像ファイルは、どこかはハッキリしていませんが、これが書かれているファイル(index.htm)と同じ場所にあります。
index.htmから見た相対的な場所にある、ということです。
先ずは、このindex.htmをデスクトップに保存して、この画像ファイル(n_shop.gif)も同じデスクトップに保存しました。
そして <img src=”n_shop.gif”> で実行したらちゃんと表示されましたね。
でもデスクトップに「test」というフォルダを作り、そこに画像ファイルを移動したら、表示されなくなりました。
そこで、ソースを書き換えました。
<img src=”test/n_shop.gif”>
