今日、買い物に行くとき。
駐車場の壁に、黒っぽい?茶色っぽい?ものが2つくっついていたので、見に行ってみました。
毛虫((((;゜Д゜)))
めっちゃモフモフ(゜ロ゜;ノ)ノ
冬のコートのファーみたい!
マンション前の歩道と道路の境には、植栽があって、木もあるので、虫がいることはわかっていましたが、歩道を越えて毛虫がやって来たのは初めてでした。
虫、大嫌いなんです!
動きが遅いヤツに関しては、見るだけならなんとか大丈夫です。
そして、蟻とミミズは大丈夫です。
とはいっても、アマゾンとかに出そうな巨大なヤツはさすがに無理そうですが……
で、話を戻して。
この毛虫が何になるのかがちょっと気になったので、写真を撮ってみました。
誰か何になるか知ってる人いるかなー?
勉強になったこと。
上で使った、画像をタップして画像を出すって方法です。
毛虫の写真をドドーンと載せるのは、後で自分で見返すのもイヤだったので、
「何かいい方法ないかなぁー」
と調べまくりました。
そして、見つけたのがこの方法。
以前、CSSにも感動しましたが、HTMLもすごいですねー
リンクを貼る方法
こちらはご存知の方が多いですよね。
<a href="URL">文字</a>
と記入すると、目的のサイトへのリンクを文字で表すことができます。
【 例 】
URLに「http://www.snow0303.com」
文字に「雪ん子’s report」
↓
雪ん子’s report
URLに「http://www.snow0303.com」
文字にも「http://www.snow0303.com」
↓
http://www.snow0303.com
これを応用して文字の部分も画像に。
<a href="クリックすると見える画像のURL" target="_blank"><img src="最初から見せる画像のURL"></a>
としてやればいいとのこと。
画像のURLの調べ方はこちら
→画像のURL(アドレス)の調べ方
【 例 】
今回の虫の画像は
<a href="https://cdn-ak2.f.st-hatena.com/images/fotolife/○○○○.jpg" target="_blank"><img src="https://cdn-ak2.f.st-hatena.com/images/fotolife/○○○○.jpg" width="200" height="300"></a>
としています。
気を付けたいのは、クリックしたあとに表示される画像のURLを先頭側に入れること。
下書きの段階で間違えて、プレビュー見てビビりました(笑)
最後の
width="200" height="300"
は画像の幅(width)と高さ(height)を指定する場合にだけ加えれば大丈夫です。
もちろん、数字部分はお好みで変更可能です。
追記
最初の画像の後の「target="_blank"」はクリックした際に出る画像を、新規のウィンドウで表示する為のHTMLです。
追記ここまで。
以上、毛虫のおかげで勉強になったお話でした。
ちなみに、今日もまだ壁登ってました。
いつまで居るんだろうか……