【びーにぃ】の、Wiki攻略本

○今年も、良い日になりますように〜！ ＼(^o^)／

＿○img 例

[ リスト | 詳細 ]

記事検索
検索

全1ページ

[1]

●色を透明にする方法（ＧＩＦのみ）

●色を透明にする方法（ＧＩＦのみ）

背景画像の上にイラスト画像を入れると、イラスト画像の外枠が白色になってしまう事はありませんか？

【サンプル画像】

http://www.geocities.jp/bea_nies/beanies_main/pierot_1.gif

もし、「白色」の外枠を「透明」にしたい場合は、画像の「色数（256色以下）を「白色（今回は「#FEFEFE」）に指定して、
「透明」になるための設定が必要になります（※GIF画像（***.gif）のみ。m(. .)m）
今回は、外枠の「白色」を「透明」に設定する方法をご紹介いたします。

※私が使用している画像ソフトは、「PictBear Second Edition」（無料）です。
　「BearFactory」さんのＨＰ→　http://sleipnir.pos.to/

１．まず、「PictBear」ソフトを起動して、ピエロの画像を開きます。

イメージ 1

２．次に、「イメージ（Ｉ）」から「パレット（Ｐ）」の「透過色の有効（Ｐ）」をクリックします。

イメージ 2

３．次に、「イメージ（Ｉ）」から「パレット（Ｐ）」の「透過色の設定（Ｔ）」をクリックします。

イメージ 3

４．「透過色の設定」ダイアログの左側にある四角の色枠が「256色」ありますが、
　　透明にしたい色は「256色」の中の「１つだけ」なので、何度か「イメージ（Ｉ）」から「パレット（Ｐ）」の
　　「透過色の設定（Ｔ）」をクリックして、四角の色枠を試してください。
　　※今回の透明設定＝インデックス：253、Ｒ：254・Ｇ：254・Ｂ：254、HTML：#FEFEFE

イメージ 4

５．そうすると、外枠の白色が透明に変わりました。

イメージ 5

６．次に、「ファイル（Ｆ）」から「上書き保存（Ｓ）」、または「名前を付けて保存（Ａ）」をクリックします。
　　※今回は、「名前を付けて保存（Ａ）」にしました。

イメージ 6

７．最後に、「ファイル名（Ｎ）」で名前を入力し、「ファイルの種類（Ｔ）」を確認して「保存（Ｓ）」ボタンをクリックします。

イメージ 7

８．ピエロ画像の外枠が、やっと透明になりました。

http://www.geocities.jp/bea_nies/beanies_main/pierot_2.gif

９．ちなみに、色を透明にする「サンプル画像」を作りました。
　　左側の画像は何もしていない「普通画像」で、中央の画像は「黒い外枠」、
　　右側の画像は「黄色の風船」を表示しました。m(. .)m

○普通画像○黒い外枠を透明に○黄色の風船を透明にする
イメージ 8イメージ 9イメージ 10
※無し※ #000000 ※ #FFFF00

以上です。m(. .)m

http://www.geocities.jp/bea_nies/00_main/bea_nies11.swf

開く トラックバック（3）

●アバターの表示方法について

●アバターの表示方法について

Yahoo!ブログでアバターを表示する方法は、今のところ２種類あります。
１つは普通のアバター画像で、もう１つは４つの顔（普通、怒る、泣く、楽しむ）のアバター画像です。

普通のアバター画像サイズは、「64×64px」、「100×100px」、「100×180px」、「180×180px」で、
顔のアバター画像サイズは、「32×32px」、「100×180px」です。

○まず、自分のアバター画像を表示するには「Yahoo! JAPAN ID」が必要です。

【例】
http://avtimg.yahoo.co.jp/yai/＊＊＊_64x64.gif
　　　　　　　　　　　　　　　┗┳┛
　　　　　　　　　　　　　　ここです！
※他の画像サイズが見つかったら変更します。m(. .)m
※動くアバター画像は表示出来ませんので、ご了承ください。m(. .)m

○普通のアバター画像（サイズ：４種類）
【６４×６４ｐｘ】
http://avtimg.yahoo.co.jp/yai/bea_nies_64x64.gif

【１００×１００ｐｘ】
http://avtimg.yahoo.co.jp/yai/bea_nies_100x100.gif

【１００×１８０ｐｘ】
http://avtimg.yahoo.co.jp/yai/bea_nies_100x180.gif

【１８０×１８０ｐｘ】
http://avtimg.yahoo.co.jp/yai/bea_nies_180x180.gif
【６４×６４ｐｘ】
https://avtimg.yahoo.co.jp/yai/bea_nies_64x64.gif

【１００×１００ｐｘ】
https://avtimg.yahoo.co.jp/yai/bea_nies_100x100.gif

【１００×１８０ｐｘ】
https://avtimg.yahoo.co.jp/yai/bea_nies_100x180.gif

【１８０×１８０ｐｘ】
https://avtimg.yahoo.co.jp/yai/bea_nies_180x180.gif

○顔のアバター画像（サイズ：２種類、顔：４種類）
【３２×３２ｐｘ】

・ノーマル（普通）
http://avtimg.yahoo.co.jp/yai/bea_nies_32x32xn.gif

・アングリー（怒る）
http://avtimg.yahoo.co.jp/yai/bea_nies_32x32xa.gif

・クライ（泣く）
http://avtimg.yahoo.co.jp/yai/bea_nies_32x32xc.gif

・スマイル（笑う）
http://avtimg.yahoo.co.jp/yai/bea_nies_32x32xs.gif
【３２×３２ｐｘ】

・ノーマル（普通）
https://avtimg.yahoo.co.jp/yai/bea_nies_32x32xn.gif

・アングリー（怒る）
https://avtimg.yahoo.co.jp/yai/bea_nies_32x32xa.gif

・クライ（泣く）
https://avtimg.yahoo.co.jp/yai/bea_nies_32x32xc.gif

・スマイル（笑う）
https://avtimg.yahoo.co.jp/yai/bea_nies_32x32xs.gif


【１００×１８０ｐｘ】

・ノーマル（普通）
http://avtimg.yahoo.co.jp/yai/bea_nies_100x180xn.gif

・アングリー（怒る）
http://avtimg.yahoo.co.jp/yai/bea_nies_100x180xa.gif

・クライ（泣く）
http://avtimg.yahoo.co.jp/yai/bea_nies_100x180xc.gif

・スマイル（笑う）
http://avtimg.yahoo.co.jp/yai/bea_nies_100x180xs.gif

【１００×１８０ｐｘ】

・ノーマル（普通）
https://avtimg.yahoo.co.jp/yai/bea_nies_100x180xn.gif

・アングリー（怒る）
https://avtimg.yahoo.co.jp/yai/bea_nies_100x180xa.gif

・クライ（泣く）
https://avtimg.yahoo.co.jp/yai/bea_nies_100x180xc.gif

・スマイル（笑う）
https://avtimg.yahoo.co.jp/yai/bea_nies_100x180xs.gif

以上です。m(. .)m

http://www.geocities.jp/bea_nies/00_main/bea_nies11.swf

開く トラックバック（1）

●２つの画像を重ねる方法

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
●２つの画像を重ねる方法

○「下の画像」と「上の画像」を重ねる方法を紹介します。
　但し、「下の画像」は「backgroundプロパティ」のみです。
　「上の画像」は、透過（または透明）した「GIF画像」で、
　「[[img( )]]」（画像）もしくは「attached( )」（画像添付）を使用してください　m(_ _)m

○「緑色の枠とその中の黄色」をカーソルに入れて、「右クリック」して「すべて選択（A)」をクリックすると、文字列が黒色に変わります。
　そして、その中で「右クリック」して「コピー（C)」をクリックします。
　後は、皆さんのブログで新規投稿して、コピーしてください　m(_ _)m

○記事を「修正」すると、半角記号の「＆＃５８；」が「　：　」（コロン）に変わってしまいます。
　ですので、もう一度、半角記号の「＆＃５８；」に変えてください。よろしくお願いします　m(_ _)m

【サンプル画像】

イメージ 2

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
○まず、「下の画像」を用意します。

※ここの記事では、「autostart=true」（自動再生あり）、「loop=true」（繰り返し再生あり）、
　「hidden=true」（プレーヤー表示なし）に設定したので、自動的に音楽が再生されます。
　なお、「再生」ボタン、「停止」ボタンなども操作出来ないので、ご了承ください　m(_ _)m

[[embed(http://www.geocities.jp/bea_nies/heal01.mp3,true loop=true hidden=true)]]
　　↓　この場所ですが、目からは見えません。見たい場合は、HTMLソースを見てください　m(_ _)m
http://www.geocities.jp/bea_nies/heal01.mp3

−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
【例文】
・内容の外側→　padding:0px;　
　幅　　　　→　width:400px;
　高さ　　　→　height:250px;
　背景画像　→　background:url(画像) no-repeat;　※全角記号の「 ＆ 」を、
　　　　　　　　必ず半角記号の「 & 」に書き換えてください。
　　　　　　　　半角記号の「 : 」に書き換えてください。
http://www.geocities.jp/bea_nies/beanies_main/rei_33148332/rei_33148332_1.swf

【実際】


＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
○次は、「上の画像」を用意します。

−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
【例文】
・内容の外側→　padding:0px;　
　幅　　　　→　width:400px;
　高さ　　　→　height:250px;
　背景画像　→　background:url(画像) no-repeat;　※全角記号の「 ＆ 」を、
　　　　　　　　必ず半角記号の「 & 」に書き換えてください。
　画像　　　→　[[img(画像リンク)]]
http://www.geocities.jp/bea_nies/beanies_main/rei_33148332/rei_33148332_2.swf

【実際】

http://www.geocities.jp/bea_nies/beanies_main/piano_1.gif

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
○最後に、「上の画像」の位置を設定します。

−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
【例文】
・内容の外側→　padding:0px;　
　幅　　　　→　width:400px;
　高さ　　　→　height:250px;
　背景画像　→　background:url(画像) no-repeat;　※全角記号の「 ＆ 」を、
　　　　　　　　必ず半角記号の「 & 」に書き換えてください。
　場所位置　→　text-align:center;
　改行位置　→　word-spacing:400px;　※幅と同じ場所に設定します。
　画像　　　→　[[img(画像リンク)]]
http://www.geocities.jp/bea_nies/beanies_main/rei_33148332/rei_33148332_3.swf

【実際】

１行目 ２行目 ３行目 ４行目 ５行目 ６行目 ７行目 http://www.geocities.jp/bea_nies/beanies_main/piano_1.gif

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
○ちなみに、 ［[img( )]]（画像）を ［[attached( )]]（画像添付）に変更することも出来ます。

−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
【例文】
・内容の外側→　padding:0px;　
　幅　　　　→　width:400px;
　高さ　　　→　height:250px;
　背景画像　→　background:url(画像) no-repeat;　※全角記号の「 ＆ 」を、
　　　　　　　　必ず半角記号の「 & 」に書き換えてください。
　場所位置　→　text-align:center;
　改行位置　→　word-spacing:400px;　※幅と同じ場所に設定します。
　画像添付　→　[[attached(数字)]]
http://www.geocities.jp/bea_nies/beanies_main/rei_33148332/rei_33148332_4.swf

【実際】

１行目 ２行目 ３行目 ４行目 ５行目 ６行目 ７行目 イメージ 1

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
以上です　m(_ _)m

【記事作成 ＞ びーにぃ©　http：//blogs.yahoo.co.jp/bea_nies 】

開く トラックバック（2）

●ＵＲＬの画像を表示できる、３つの方法

●ＵＲＬの画像を表示できる、３つの方法

※「ブリーフケース」と「Yahoo!フォト」に保存しているファイルにリンクすると、
　約24時間経ってしまうと画像が見えなくなります。
　従って、ファイルをリンクする事は出来ません。

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
○ホームページを保存している、普通の画像を入れる方法

※画像と文字列の中にスペースを入れない場合は、英数字のリンクと文字列だけになってしまいます。
　ですので、必ず「半角スペース」（全角スペースだけだと、不可）を入れてください　m(_ _)m
　（「半角スペース」＋「全角スペース」は、可）

※「ブリーフケース」と「Yahoo!フォト」は出来ません　m(_ _)m

【例文】
http://www.geocities.jp/bea_nies/beanies_main/cat_woman_mimi01.jpg ジオシティーズの画像

http://img.yahoo.co.jp/i/jp/blog/p2/images/emo/57.gif スマイルくん（？）の画像
【実際】

http://www.geocities.jp/bea_nies/beanies_main/cat_woman_mimi01.jpg ジオシティーズの画像

https://img.yahoo.co.jp/i/jp/blog/p2/images/emo/57.gif スマイルくん（？）の画像

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
○ホームページを保存している画像の前と後ろに「’’」を入れて、
　その後に「全角スペース」を入れる方法　※　’’ｈｔｔｐ：〜．’’

※「幅」と「高さ」の設定は出来ません。

※今回は、「avtimg.yahoo.co.jp」さんのリンク先にしました。

【例文】
''http://avtimg.yahoo.co.jp/yai/bea_nies_100x180xc.gif''　○哀しい顔　　　''http://avtimg.yahoo.co.jp/yai/bea_nies_100x180xs.gif''　○笑顔　　　''http://avtimg.yahoo.co.jp/yai/bea_nies_100x180xa.gif''　○怒った顔
【実際】

https://avtimg.yahoo.co.jp/yai/bea_nies_100x180xc.gif　○哀しい顔　　　https://avtimg.yahoo.co.jp/yai/bea_nies_100x180xs.gif　○笑顔　　　https://avtimg.yahoo.co.jp/yai/bea_nies_100x180xa.gif　○怒った顔

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
○半角英数字の　［［ｉｍｇ（　）］］　を書いて、その中にホームページを保存している
　画像のＵＲＬを貼る方法。

※画像と文字列の中に入るスペースは、入れても入れなくて大丈夫です　m(_ _)m

【例文】
[[img(http://www.geocities.jp/bea_nies/beanies_main/cat_woman_mimi01.jpg)]]　ジオシティーズの画像（ノーマル）

[[img(http://www.geocities.jp/bea_nies/beanies_main/cat_woman_mimi01.jpg,216,186)]]　ジオシティーズの画像（幅：216px　高さ：186px）
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
[[img(http://img.yahoo.co.jp/i/jp/blog/p2/images/emo/57.gif)]]　 スマイルくん（？）の画像（ノーマル）

[[img(http://img.yahoo.co.jp/i/jp/blog/p2/images/emo/57.gif,66,54)]]　 スマイルくん（？）の画像（幅：66px　高さ：54px）
【実際】

http://www.geocities.jp/bea_nies/beanies_main/cat_woman_mimi01.jpg　ジオシティーズの画像（ノーマル）

http://www.geocities.jp/bea_nies/beanies_main/cat_woman_mimi01.jpg　ジオシティーズの画像（幅：108px　高さ：93px）
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
https://img.yahoo.co.jp/i/jp/blog/p2/images/emo/57.gif　 スマイルくん（？）の画像（ノーマル）

https://img.yahoo.co.jp/i/jp/blog/p2/images/emo/57.gif　 スマイルくん（？）の画像（幅：66px　高さ：54px）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
以上です　m(_ _)m

【記事作成 ＞ びーにぃ©　http：//blogs.yahoo.co.jp/bea_nies 】

開く トラックバック（1）

●記事の幅を調節する（Wiki）

●記事の幅を調節する（Wiki）


【サンプル画像】　http://ww8.tiki.ne.jp/~k-na/
※ライン画像の素材は、「Ayayaの部屋」さんのHPより頂きました　m(_ _)m

http://www.geocities.jp/bea_nies/beanies_main/line073s.gif

※基本は「img(, 幅, 高さ, 文字列)」です。
※Yahoo! ブログの記事で幅を作る時は、必ず「 560px以内 」にしましょう。
　もし、その幅より大きな画像を作ると、記事全体が崩れる可能性がありますので、
　注意してください。
※画像を「右クリック」すると、別ウインドウが開きます。

○【例文】の中には、解るように「全角」の記号を書いていますが、
　実際に文を作る場合は、必ず「半角」の記号に取り換えてください。
○【例文】の行が長くなる場合は、途中の行で「 ↓連続 」を書き、
　最後の行末を「 <--改行 」で書いています。
○【実際】の文を作成する場合は、「 ↓連続 」と「 <--改行 」を全部、削除してください。

▼直接、画像を入れる。

【例文】

▽[[img( )]] の値を、全部設定する場合。
※画像の中にマウスを入れると、内容が見られます（例：カラーラインです）。
[[img(http://www.geocities.jp/bea_nies/beanies_main/line073s.gif,560px,9px,カラーラインです)]]
【実際】

http://www.geocities.jp/bea_nies/beanies_main/line073s.gif

▽[[img( )]] の値を、幅（ 560px ）だけ設定する場合（「縮小」と「文字列」は自動設定です）。
[[img(http://www.geocities.jp/bea_nies/beanies_main/line073s.gif,560px,,)]]
【実際】

http://www.geocities.jp/bea_nies/beanies_main/line073s.gif

▼「Wiki」＋「CSS」文の文字列を設定する

【例文】

▽[[img( )]] の値を、全部設定する場合。
※画像の中にマウスを入れると、内容が見られます（例：カラーラインです）。
||<#ffffff' style=' width:560px; padding:0px;' ``[[img(http://www.geocities.jp/bea_nies/beanies_main/line073s.gif,560px,9px,カラーラインです)]]||
【実際】

http://www.geocities.jp/bea_nies/beanies_main/line073s.gif

▽[[img( )]] の値を、幅（ 560px ）だけ設定する場合（「縮小」と「文字列」は自動設定です）。
||<#ffffff' style=' width:560px; padding:0px;' ``[[img(http://www.geocities.jp/bea_nies/beanies_main/line073s.gif,560px,,)]]||
【実際】

http://www.geocities.jp/bea_nies/beanies_main/line073s.gif

○画像の「幅（560px以内）」や「高さ」、「文字列」も、自由に設定できます。
||<#ff9955' ``[[img(http://www.geocities.jp/bea_nies/beanies_main/line073s.gif,300px,50px,太いラインです。太いラインです。太いラインです。太いラインです。太いラインです。)]]||
http://www.geocities.jp/bea_nies/beanies_main/line073s.gif

【記事作成 ＞ びーにぃ©　http：//blogs.yahoo.co.jp/bea_nies 】

開く トラックバック（1）

全1ページ

[1]

Yahoo!ブログからのお知らせ

.
びーにぃ
びーにぃ
男性 / O型
人気度
Yahoo!ブログヘルプ - ブログ人気度について

ブログバナー

検索 検索

最新のコメント

最新のトラックバック

日 月 火 水 木 金 土
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30

過去の記事一覧

友だち(7)
  • お嬢
  • komiti
  • 【電柱】*）Ｕｓａ
  • hige
  • jyajya
  • e**ma
友だち一覧

Yahoo!からのお知らせ

仲間関係

Wiki文法関連

フラッシュ関連

ブログ素材

音楽関連

常連さん

ブログ関連

よしもとブログランキング

もっと見る

[PR]お得情報

ふるさと納税サイト『さとふる』
実質2000円で特産品がお手元に
11／30までキャンペーン実施中！
コンタクトレンズで遠近両用？
「2WEEKメニコンプレミオ遠近両用」
無料モニター募集中！
ふるさと納税サイト『さとふる』
お米、お肉などの好きなお礼品を選べる
毎日人気ランキング更新中！
話題の新商品が今だけもらえる！
ジュレームアミノ　シュープリーム
プレゼントキャンペーン

その他のキャンペーン

プライバシー -  利用規約 -  メディアステートメント -  ガイドライン -  順守事項 -  ご意見・ご要望 -  ヘルプ・お問い合わせ

Copyright (C) 2019 Yahoo Japan Corporation. All Rights Reserved.

みんなの更新記事
前へ 次へ