バカネコ日記

フリーページ

2004年07月01日
XML
カテゴリ:カテゴリ未分類

 
今回は講師が遅刻してしまったので、即、始める。

リンクの基本形は 

  <a href="URL">テキスト</a>

であった。 忘れた方や、追記を見ていない方は前回のページを
もう一度おさらいしてほしい。

寄り道だが、ここでHTMLのパターンを見てみよう。
HTMLはタグというものを使って記述するのであった。

タグとは、こんな半角のカッコ <> で囲んだものである。
リンクなら <a> 太字指定なら <b> イタリック指定なら <i>
などである。

これらは「ここからタグの内容を適用しますよ」という意味であり、
開始タグと呼ばれる。
これに対して「ここでタグの効力はおしまいだよ」と示すのが終了タグである。

リンクなら </a> 太字指定なら </b> イタリック指定なら </i>
何のことはない、単にスラッシュが付いただけである。

そして、タグの使い方は適用したい文字列を開始タグと終了タグで挟むだけだ。





実演してみよう。


ここで<b>里親募集</b>しています。 ←HTMLソース
    ↓
ここで里親募集しています。    ←ブラウザ上での表示


ここで<i>里親募集</i>しています。 ←HTMLソース
    ↓
ここで里親募集しています。    ←ブラウザ上での表示


なんという安直なルールであろうか。
考えた奴はきっと安直な性格だったに違いない。←偏見

これでもHTMLは難しいとおっしゃるかな?
実際のところはきわめて単純なルールで構成されているのである。
若干の例外はあるものの、所詮はこの組合せなのだ。




ちょっと待て! リンクの場合はもっとややこしいじゃないか!

確かに、そのとおり。
タグで挟むだけならネコでも書けそうだ。

リンクの場合、開始タグの中に「href="URL"」というあて先を書かなければ
役に立たなかった。
実はHTMLを見づらくしているのは、このパラメータも元凶のひとつである。

しかし、このパラメータのおかげで、単純なルールにも関わらず、タグは
実に多様な指示をすることが出来るのである。
まあ、HTMLのルールは単純だということと、パラメータがいろいろあるよ、
ということだけ覚えておけば良かろう。




手を広げすぎると、何の説明だか分からなくなるので、リンクの話に戻る。

さて、今回はテキストではなく画像をリンクさせてみよう。
基本形は
<a href="URL">テキスト</a>
であった。

この、テキストの部分を画像に取り替えるだけの話である。したがって、

<a href="URL"><IMG SRC="画像のパス"></a>

となる。 簡単でしょ?



この、<IMG>が画像を表示する開始タグであり、SRC="画像のパス" が
「画像はここにありますよ~」というパラメータである。
パスというのは画像をおいてある場所+ファイル名である。
楽天日記では通常URLと同じ形式で示す。

ここで、リンクの飛び先URLと混同しないように注意すること。
片方はリンク先を示し、もう片方は画像の置き場所を示すものだ。


実際に書いてみる。
リンクの飛び先をこのサイトのアクセスログ
http://plaza.rakuten.co.jp/nyancolon/?func=log とし、
画像はミケの写真を使ってみる。


<a href="http://plaza.rakuten.co.jp/nyancolon/?func=log"><IMG SRC="http://plaza.rakuten.co.jp/img/user/49/28/5934928/39.jpg"></a>

実際のブラウザ上の表示は以下のようになる。
クリックすれば当サイトのアクセスログのページへジャンプする。




<IMG>タグの中には他にもサイズ指定や代替文字指定などをぶち込むことが出来る。

たとえば

<IMG SRC="画像のパス" width="320" height="240" alt="目が開いたミケ">

もう、お気づきだろうが、widthが横幅指定、heightが高さの指定である。
この数字をいじれば、元画像を編集することなく、見かけの大きさを変更できる。
もっとも画像の重さとか、きめの細かさは変わらない。
見かけを小さくしても容量は減らせないし、拡大すれば画面は粗くなる。

altは、本来は画像が表示できない場合にその代替として表示される文字列だ。
画像が表示されている場合は、マウスカーソルを画像の上にあわせると
まるで説明文のような感じで出てくるアレである。


今回ここまで。



この記事がおもしろかったと思う人は1票! クリック → おもしろかったらクリックしてね








最終更新日  2004年09月08日 16時16分51秒
コメント(14) | コメントを書く

PR

バックナンバー

2019年08月
2019年07月
2019年06月
2019年05月
2019年04月

プロフィール


海獣トド

コメント新着

 海獣トド@ Re:意外な一面に触れて。(08/14) 泡雪さんへ >マザーテレサって本当にす…
 海獣トド@ うめぼしがキラリ☆さんへ >ひゃー、ブログさぼってる間にトドさん…
 海獣トド@ 鵜の岬さんへ >これからも・・ヨロシク・・ね こち…
 海獣トド@ sshijimisanさんへ >でも、トド様のおかげで少しの村民は救…
 海獣トド@ もぐらのこさんへ >日記の下書き機能残ってるよ(^-^) …
 海獣トド@ archfelisさんへ >せめて12日一杯残せばいいのに・・・…

Copyright (c) 1997-2019 Rakuten, Inc. All Rights Reserved.