Yahoo!ブログの便利屋さん

画像に枠をつける方法1.0(wiki文法)

画像に影をつける方法

画像に枠をつけてよりよくレイアウトしてみましょう。

使用例

※フリー画像使用です
※Firefox等のブラウザだと正しく表示されない可能性があります

基本文法

||<#FFFFFF'style='font-weight:bold;border:dotted 3px #■■■■■■'``[[attached(●)]]||

●・・・画像番号(半角数字)　※画像をアップロードした順番
■■■■■■・・・カラーコード6桁(半角英数字)
カラーコード一覧

基本文法の書き換え方
基本文法中の ● を 画像番号 に書き換える。
基本文法中の ■■■■■■ を指定したい枠色のカラーコードに書き換える。
カラーコード一覧

書き換え方の例

||<#FFFFFF'style='font-weight:bold;border:dotted 3px #ff0000'``[[attached(３)]]||
※実際に使う際、数字は半角にします

※ご質問などはこちらのコメント欄へお願いします。
※転載、傑作ポチは大歓迎です。転載の際は一言コメントをよろしくお願いいたします

---

ブログ名　Yahoo!ブログの便利屋さん
URL　http://blogs.yahoo.co.jp/dtx_x7

---

画像に影をつける方法(wiki文法)

画像に影をつける方法

そのまま載せた画像は味気ない！
そんな方のために画像に影をつける方法を紹介します。

使用例

※元は普通のフリー画像です
※Firefox等のブラウザだと見れない可能性があります

基本文法

通常は
||<#FFFFFF'style='filter:Blur(strength=8,direction=135)' ``[[attached(●)]]||
※使用例と同じ感じになります

応用したい方は
||<#FFFFFF'style='filter:Blur(strength=■,direction=▲)' ``[[attached(●)]]||

●・・・画像番号(半角数字)　※画像をアップロードした順番
■・・・影の強さ(半角数字)　※通常は6〜10程度。0にすると影がなくなります。
▲・・・影の角度(半角数字)

影の角度一覧
上右・・・45
右下・・・135
上左・・・315
左下・・・225

基本文法の書き換え方
基本文法中の ● を 画像番号 に書き換える。
基本文法中の ■ を 目的の影の強さの数字 に書き換える。
基本文法中の ▲ を 目的の影の角度の数字 に書き換える。

書き換え方の例

||<#FFFFFF'style='filter:Blur(strength=12,direction=135)' ``[[attached(３)]]||
※実際に使う際、数字は半角にします

※ご質問などはこちらのコメント欄へお願いします。
※転載、傑作ポチは大歓迎です。転載の際は一言コメントをよろしくお願いいたします

---

ブログ名　Yahoo!ブログの便利屋さん
URL　http://blogs.yahoo.co.jp/dtx_x7

---

画像の表示位置を変える方法(wiki文法)

画像の表示位置を変える方法

「画像添付」で載せた画像、通常は記事の一番上に表示されます。
それを、wiki文法を使って好きな位置に載せる方法を紹介します。

使用例
　このように好きな場所に画像を載せることができます。

基本文法

[[attached(●)]]　※この基本文法を画像を載せたい位置に書き込む

●・・・画像番号(半角数字)　※画像をアップロードした順番

基本文法の書き換え方
基本文法中の ● を 画像番号 に書き換える。

書き換え方の例

[[attached(３)]]　※実際に使う際、数字は半角にします

応用編

このwiki文法を応用し、更に記事中央に表示したり右端に表示することができます。

使用例

基本文法

[[attached(●,■)]]　※この基本文法を画像を載せたい位置に書き込む

●・・・画像をアップロードした順番(半角数字)
■・・・画像の位置情報(半角英字)

基本文法の書き換え方
基本文法中の ● を アップロードした順番の番号(上から順に1〜) に書き換える
基本文法中の ■ を 位置情報に書き換える

位置情報一覧
左・・・left
中央・・・center
右・・・right

書き換え方の例

[[attached(３,center)]]　※実際に使う際、数字は半角にします

※ご質問などはこちらのコメント欄へお願いします。
※転載、傑作ポチは大歓迎です。転載の際は一言コメントをよろしくお願いいたします

---

ブログ名　Yahoo!ブログの便利屋さん
URL　http://blogs.yahoo.co.jp/dtx_x7

---