398 ページ
世界のデザイン
imgタグでキラキラフォントを使いこなす
なかなか使いづらいと思います。どこでどうやって使えばイイのか…？
サイズが上手く調節できない…
使うとデザインが雑然としちゃう…などなど。
今回は使いかたのヒント、ブログデザインのテクの紹介です。
「img」タグといわれても、初心者の方はよくわからないと思います。
ブログやホームページは「タグ」の組み合わせで表示されています。ブログには文字だけではなく色々なアイテムが表示されています。リンクを始め、画像、動画、コメントボックス、そして、ブログパーツ。これらをウェブページに表示する役割を果すのが、それぞれに対応した「タグ」なのです。
今回使うのは「img」タグ。画像を表示するときに使うタグです。GIF系のキラキラフォントで主に使用されています。
こういう感じのヤツです。
「高性能テキストエディタ」等、ワープロ系のエディタを使って更新するようなブログを除けば、ほとんどのブログで使えると思います。
■サイズを調整する。
では、まずサイズを調整する方法を紹介します。
この赤い部分の「width="〇〇"」「height="〇〇"」の部分を付け加えます。半角スペースを入れるのを忘れないでください。
この「width」が、画像の幅、「height」が、画像の高さです。これで、強制的に画像の表示サイズを調整することが出来るようになります。
width="200px" height="50px"
width="100px" height="150px"
これは、キラキラフォントに限らず、「img」タグを使っているすべての場面で使えます。等しいサイズでバナーを並べたいなどという時も重宝します。
ブログやホームページは「タグ」の組み合わせで表示されています。ブログには文字だけではなく色々なアイテムが表示されています。リンクを始め、画像、動画、コメントボックス、そして、ブログパーツ。これらをウェブページに表示する役割を果すのが、それぞれに対応した「タグ」なのです。
今回使うのは「img」タグ。画像を表示するときに使うタグです。GIF系のキラキラフォントで主に使用されています。
<img src="http://abc.blog.com/img/kirakira.gif" alt="キラキラフォント" />
こういう感じのヤツです。
「高性能テキストエディタ」等、ワープロ系のエディタを使って更新するようなブログを除けば、ほとんどのブログで使えると思います。
■サイズを調整する。
では、まずサイズを調整する方法を紹介します。
<img src="http://abd.blog.com/img/kirakira.gif" width="96px" height="50px" alt="キラキラフォント"/>
この赤い部分の「width="〇〇"」「height="〇〇"」の部分を付け加えます。半角スペースを入れるのを忘れないでください。
この「width」が、画像の幅、「height」が、画像の高さです。これで、強制的に画像の表示サイズを調整することが出来るようになります。
これは、キラキラフォントに限らず、「img」タグを使っているすべての場面で使えます。等しいサイズでバナーを並べたいなどという時も重宝します。
▼ Comment
この記事にコメントする
PR
ミステリー読み物
海外情報で面白ければばなんでも調べてレビュー。ウィキペディアのみならず、関連サイトを詳しく下調べしてから、記事を書き上げます。世界のトレンド情報も、レトロ情報も、ファッション・デザインに到るまで。
