ウェブサイトでの使い方

ウェブサイト、ブログでのico電の使用方法をを説明します。

とはいえサイトやブログを運営している人なら説明は不要だとは思いますがico電の画像サイズが大きいためその補足です。

ウェブサイト、ブログで利用する場合、必ずダウンロードして自分のサーバーにアップして使ってください。直リンクは禁止です。

ico電をキレイに表示させる

ico電は192×192で作られています。これをそのまま表示すると

この大きさになります。サイトで利用するにはちょっと大きすぎるかと思います。

なので、画像を表示するimgタグの数値をいじります。

<img src="http://〜(アドレス)/S_JREXP_E7.png" width="96" height="96">

と、widthとheightのところを96にすることで

元の半分でこの見た目になります。画像自体のサイズはそのままなのでratinaディスプレイや4kディスプレイ、スマホからでは滑らかな見た目になります。ico電ひろばでもこの大きさで表示させており、これがico電の本来想定している大きさです。

これでも大きい場合は

<img src="http://〜(アドレス)/S_JREXP_E7.png" width="48" height="48">

<img src="http://〜(アドレス)/S_JREXP_E7.png" width="24" height="24">


が良いかと思います。

数値は自由に決めてもいいんですが、これら(24・48・96)整数倍の数値を入れることで美しく表示できます。

注意点

ico電は輪郭線を描いていません。なので、背景が白いサイトでは、
こんな風にJRの周りが白い車両などは、多少色を入れていますが背景と同化して見えてしまうのでご注意ください。