|
カテゴリ:カテゴリ未分類
今回は講師が遅刻してしまったので、即、始める。 リンクの基本形は <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票! クリック → お気に入りの記事を「いいね!」で応援しよう
遅刻した講師の話を 遅刻して聞きに来ました 生徒Aです。
altも変える事出来たんですね~うっしっし・・。 ありがとうございます。 今日は ちょっと贅沢なビールを飲みつつお勉強しました。 (2004年07月03日 19時01分12秒)
>遅刻した講師の話を 遅刻して聞きに来ました 生徒Aです。
廊下に立ってなさい...って、今日は言えないのかぁ。 >altも変える事出来たんですね~うっしっし・・。 けっこう、いじりがいがあって楽しそーでしょ? >今日は ちょっと贅沢なビールを飲みつつお勉強しました。 ああーっ、いーないーな。エビスだな、さては? 我が輩にも飲ませろ~! どうもビールの話になると急に意地汚くなるトドであった。 暑さのせいか、品性が足りないせいか...。 (2004年07月03日 19時39分46秒)
>ごめんなさい、私も遅刻しました。
ハイ、あなたグラウンド10周ね。(←イヤミな体育女教師風) >はやく試せば良いのに、なかなか試せないぐずな生徒です。 早くしないと居残りにゃん。 >私は牛乳酎飲んでます。(焼酎の牛乳割り うっ、酒好きのわしも、そ、そりは...。 (2004年07月04日 00時45分36秒)
ホームを訪問していただき、ありがとうございます。タグについては、まだまだ学習中で、いろいろ参考にさせていただきます。
ありがとうございました。 (2004年07月04日 20時29分55秒)
こんばんは、海獣トド先生!
第2講、今頃見に来ました。大遅刻(笑 とても分かりやすくまとめてありますね~ 今度、どらみの弟子たちに教えるときに使わしてください☆ 物事を文章で分かりやすく説明できる才能、どらみも欲しいです… ちなみに3日はバーベキューで久しぶりにビールを呑みました。 多分、授業中ではないはず…(汗 (2004年07月04日 22時35分44秒)
>こんばんは、海獣トド先生!
>第2講、今頃見に来ました。大遅刻(笑 またか。 >とても分かりやすくまとめてありますね~ >今度、どらみの弟子たちに教えるときに使わしてください☆ 当然の著作権料としてバーベキューとビールを要求する。 >ちなみに3日はバーベキューで久しぶりにビールを呑みました。 >多分、授業中ではないはず…(汗 ばかもの! 授業中じゃ。 廊下に立っとれ! ん? まてよ、今回は特別に酒気帯び出席OKにしたんだっけ? わりーわりー。 (2004年07月05日 03時22分10秒)
<a>,<b>,<i>初めてやってみました。画像はまだやってませんが、<A hret="URL">テキスト</a>もやってみました。
リンク出来ました。うれしーい。感激で~す\(^o^)/ 有難うございました。 (2004年08月16日 15時52分08秒)
こももちゃん4363さんへ
><a>,<b>,<i>初めてやってみました。画像はまだやってませんが、<A hret="URL">テキスト</a>もやってみました。 >リンク出来ました。うれしーい。感激で~す\(^o^)/ あらまあ、感激ですか。私も嬉しいです。 良かったですね。 (2004年08月16日 16時01分08秒)
たびたび教えてもらい、お世話になってます!
また1つあるんですが…1枚の画像に複数のリンクを貼るのは楽天ブログで可能でしょうか? 日本地図に北海道、東北、などの字を入れてその字をクリックしたら別ページに飛ばしたいんです。ネット見たり人に聞いたりしてやってみてるんですが、受け付けないタグがあったりで出来ません~。 (2008年09月14日 22時33分24秒)
>また1つあるんですが…1枚の画像に複数のリンクを貼るのは楽天ブログで可能でしょうか?
基本的に1つの画像には1つしかリンクは張れません。 >日本地図に北海道、東北、などの字を入れてその字をクリックしたら別ページに飛ばしたいんです。 それは、クリッカブルマップを使えば可能ですが、 初心者にはかなりややこしい上に、楽天では 使えなかったと思います。 楽天では使用可能なタグは限定されているのです。 無理やり実現する方法もあるでしょうが、 それなりの技術を要します。 (2008年09月15日 11時19分56秒)
そうか~基本ダメだと分かるとすっきりしました!
別の方法で頑張ってみます、ありがとうございました! (2008年09月15日 13時57分40秒)
>そうか~基本ダメだと分かるとすっきりしました!
どういたしまして。 >別の方法で頑張ってみます、ありがとうございました! 画像をいくつか組み合わせるという手もありますが... 面倒です(笑) (2008年09月18日 20時51分45秒) |
|