少しずつリライトもしてます！
どうも、おハナマルです。
最近、また少しずつアクセスが増えてきて嬉しく感じています♪
ブクマやシェア、ありがとうございます！
せっかく読んでくださる方が増えてきているので、せっかくならどんなページがあるのかしっかりわかってもらいたい。そう思って、今まではなかったスマホの『カテゴリ画像リンク』を作り始めました。
自分で作業してみて、【今まで知らなかったこと】【苦戦したところ】をわかりやすくまとめてみました。
目次
１、『画像リンク』の作り方
まずは、基本の『画像リンク』の作り方です。
＜基本作業＞
【HTML】
①リンク先のアドレスをコピーしてきて"リンク先"に貼り付ける
②使いたい画像のアドレス※を"画像パス"に入れる
※画像アドレス取得の方法は、パソコンによって違うこともありますが、「右クリック→プロパティ」で表示させることもできるようです。
基本はこれで終わりです。
次に『はてなブログ』での私のやり方も説明しておきます。
＜はてなブログでのやり方＞
①リンク先のアドレスをコピーしてきて"リンク先"に貼り付ける
②画像パスの入れ方
（１）下書きページに【写真を投稿】から写真を貼り付けます。
（２）【HTML編集】を開き、「<img class="」より先を「" />」までをコピーします。("から"までの間をコピーです)
（３）そのコピーを"画像パス"に張り付けます。
これで完了です。
このようになります↓
２、『画像サイズ』の変え方
上のままでは画像サイズが大きすぎるので、サイズを縮小させます。
【HTML】
これを「 />」の前に入力します。（ ～width="50%" height="50%" />）
【50%】だと、スペースを入れて横に２つ並べられないので、私は【48%】にしています。これはお好みでいいと思います。
１つで表示するとこんな感じです↓
※これは【５０％】です。
※画像例なのでリンクは貼ってません。
３、画像を横並びにする方法
【HTML編集】で</p><p>を間に挟んだ状態だと、画像は上下に並んでしまいます。
（ ～height="48%" /></a></p>
<p><a href= ～）
こうなる↓
※画像例なのでリンクは貼ってません。
２つの画像を横並びにしたい場合は、『1』『2』で作ったHTMLを単純にくっつけて配置しましょう。(スペースは可能です。)
（～ height="48%" /></a> <a href=～）
くっつけると、横に並びます↓
※半角スペースを間に入れています
＜まとめ＞
始めてしまえば、なんてことない作業だったのですが、初めて『画像リンクを作る』『画像を横並びにさせる』となると、調べないとならないので手間取りました。
自分でも忘れないように、わかりやすくまとめられたと思うので、自分で『画像リンク』を作ってみたい方は、参考にしてみてください。
では。
ブログに役立つ記事はこちら↓
