* KAORのブログ講座 *

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

画像に枠をつける方法

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

使用例

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

基本文法

[[attached(●)]]

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

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

書き換え方の例

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

---

ブログ名　* KAORのブログ講座 *
URL　http://blogs.yahoo.co.jp/gpiegsdvuxjcvweguw

---

http://www.tokyovalley.com/yahoo_blog/article/article.php
http://i.yimg.jp/images/auct/blogparts/Seller300250Yellow.swf?s=2&cl=0&sl=brand_club&di=0&od=0&ti=&pt=2&dotyid=aucy%2Fp%2FoY.q42SxJKnKBiiAft0P8hSx.mwc_lQ-&sid=2219441&pid=878398084
http://x7.byoubu.com/bin/ll?10430840N
http://www28.atpages.jp/yblninja/ninja.php

画像に影をつける方法(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(３)]]||
※実際に使う際、数字は半角にします

---

ブログ名　* KAORのブログ講座 *
URL　http://blogs.yahoo.co.jp/gpiegsdvuxjcvweguw

---

http://www.tokyovalley.com/yahoo_blog/article/article.php
http://i.yimg.jp/images/auct/blogparts/Seller300250Yellow.swf?s=2&cl=0&sl=selbycojp&di=0&od=0&ti=&pt=2&dotyid=aucy%2Fp%2FoY.q42SxJKnKBiiAft0P8hSx.mwc_lQ-&sid=2219441&pid=878398084
http://x7.byoubu.com/bin/ll?104308409

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

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

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

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

基本文法

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

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

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

書き換え方の例

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

応用編

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

使用例

基本文法

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

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

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

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

書き換え方の例

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

---

ブログ名　* KAORのブログ講座 *
URL　http://blogs.yahoo.co.jp/gpiegsdvuxjcvweguw

---

http://i.yimg.jp/images/auct/blogparts/Seller300250Yellow.swf?s=2&cl=0&sl=precious_auction_store&di=0&od=0&ti=&pt=2&dotyid=aucy%2Fp%2FoY.q42SxJKnKBiiAft0P8hSx.mwc_lQ-&sid=2219441&pid=878398084
http://www.tokyovalley.com/yahoo_blog/article/article.php
http://x7.byoubu.com/bin/ll?104308408