wiki文法

画像の位置や繰り返しを指定するプロパティを説明します。
Ks BLOGさん,めざぼーさんの記事を参考にさせて貰ってます。

アジサイを描いてみました。うまくないですがこの記事に合う画像がなかったので描きました。

||<#ffffff'style='background-image:url(http://img.blogs.yahoo.co.jp/ybi/1/cb/66/suzutakaho/folder/78634/img_78634_5805007_4?20050710071634.jpg);color:#000000;font:bold 20px'``アジサイを描いてみました。うまくないですがこの記事に合う画像がなかったので描きました。||
●何も指定しなければこのよう敷き詰められます。
●（http://～）の「：」は「&＃58」に修正する度に書き換えてください。
●画像は非公開書庫かYahooブリーフケースなどに保存してください。

right bottom no-repeat の場合　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　アジサイを描いてみました。うまくないですがこの記事に合う画像がなかったので描きました。

||<#ffffff'style='width:560;height:300;background-image:url(http://img.blogs.yahoo.co.jp/ybi/1/cb/66/suzutakaho/folder/78634/img_78634_5805007_4?20050710071634.jpg) right bottom no-repeat;color:#00dd00;font:bold 20px'``right bottom no-repeat の場合 　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　アジサイを描いてみました。うまくないですがこの記事に合う画像がなかったので描きました。||
●（http://～）の「：」は「&＃58」に修正する度に書き換えてください。
●必ず領域（width:560;height:300）を指定ください。
●画像は非公開書庫かYahooブリーフケースなどに保存してください。
  
  背景画像の位置：left、right、top、bottomの組み合わせ 
  指定なしの場合はcenter
  
  repeat：全面に敷き詰める（指定しない場合はこれになります）
  repeat-x：横方向のみ繰り返す 
  repeat-y：縦方向にのみ繰り返す
  no-repeat：繰り返さずに１点だけ表示

転載元: 「ＴＡＫＥＳＩ★ＢＬＯＧ」のブログは閉鎖致します。

||<#ffffff'style=padding:0px;background-image:url(http://～最初に表示する画像のＵＲＬ); onMouseOver=this.style.backgroundImage='url(http://～カーソルが乗った時の画像のＵＲＬ)' onMouseOut=this.style.backgroundImage='url(http://～カーソルが離れた時の画像のＵＲＬ)' width=200px height=200px ``|| ●後の``と||の間に``文字列を書くと文字が中央に入ります。色や大きさも変えられます。詳しくは背景画像の上に文字を書く記事をご覧下さい。|| ●http://の「：」を修正の度に「&＃58」に置き換えてください。onMouseの前の半角重要です。（メモ帳等で編集してからアップすると便利です。） ●画像の大きさとテーブルの大きさを同じにしてください。 ●画像は非公開の記事（書庫）かYahooブリーフケースにアップしてから使ってください。この画像元は非公開の記事にしてます。

||<#ffffff' ``|| ||<#ffffff' rowspan=3 id=ab1 style='width:100px;height:180px;padding:0px;' `` ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``いちごちゃん ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``ひでさん ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``ぶるみんさん ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``MIMIMIさん ||<#ffffff' ``|| ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``りかさん ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``めぐみんさん ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``らずりさん ||<#ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``Tamaさん ||<#ffffff' ``|| コピーして貼りつける場合は、改行の空白を詰めて下さいね。＆#は、半角にして下さい！

テーブルを組んでいます。一番上段の↓がクリックしたときに表示するソースです。 #ffffff' rowspan=3 id=ab1 style='width:100px;height:180px;padding:0px;' `` #ffffffは、背景色。rowspan=3は、上下２列にセルを連結させてます。 idのNAMEを入れて、表示させてます。この名前はなんでもいいです。ここでは、ab1としときました。 padding:0pxで余白をなくしてますが、入れなくてもＯＫです。そして次の行です。 #ffe4e1' style='color:#ff3399;border:1px solid #ff9966' onmouseover=ab1.innerHTML='<img＆#32border=0＆#32src=http＆#58;//省略＆#32width=100＆#32height=180>' onmouseout=ab1.innerHTML='' ``いちごちゃん #ffe4e1は、背景色。color:#ff3399（文字色）、border:1px solid #ff9966（ボーダーの幅,種類,色） onmouseover（カーソルが触れた時）。ab1.innerHTML（interの前にID名)。 border=0（画像の余白を無くしてます）、空白の部分は半角＆#32をいれます。画像URL width=画像の横幅 height=画像の高さです。＜＞は半角ですよ。 onmouseout（カーソルが離れた時）、ab1.innerHTML=''空白なのは、画像が離れた時のアクションは特に必要がなかったので、入れませんでした。 ``いちごちゃん　``の後に文字を入れる。後は同じように記入するだけです。こんな説明で分るか疑問です。

フォントを一括で指定する

font-style属性、font-variant属性、font-weight属性、font-size属性、line-height属性、font-family属性の順に記述します。（font-style属性、font-variant属性、font-weight属性は、順番を入れ替える事ができます）

font-size属性とfont-family属性以外は記述を省略することが可能です。

||<#00ced1' style='font:italic bold 22pt sans-serif;color:#ffffff;text-align:center;border-bottom:5px solid #00fa9a;border-top:5px solid #00fa9a;width:560px;' ``YAHOO!BLOGで遊ぼう！|| コピーして張り付ける場合は、改行の空白を詰めて下さいね。

||<#ffffff' style='background-image:url(http://img.blogs.yahoo.co.jp/ybi/1/cb/66/suzutakaho/folder/32414/img_32414_10003334_0?1125121609);width:560;height:400;vertical-align:bottom;text-align:center;font:bold 16px;color:#ffff66' ``[[img(http://img.blogs.yahoo.co.jp/ybi/1/cb/66/suzutakaho/folder/32414/img_32414_10003334_1?1125122979 ,80, ,)]] ＜サギの写真をクリックすると拡大します。||　　　　　　　　　　　　　　　　　　　　　↑縮小するサイズ指定　URL ,タテ,ヨコ,どちらかでよい。比率を変えると編倍します。 ●背景画像は別の非公開の記事か他のサーバーにアップしてください。（ぼくは非公開の記事でやってます。） ●background-image:url(http://～のhttp:の『：』は『&＃58』修正の度に入力してください。画像リンクがある場合は「&＃58」にしなくても良いです。 ●全体に1枚だけ入れる時は『背景サイズ　width:サイズ;height:サイズ』と画像ピクセル数のサイズを合わせてください。背景のサイズより画像サイズが小さい場合は敷き詰められます。反対に画像が大きい場合は周囲がカットされます。　 ●非公開で記事を書いて全文コピーして新規投稿すると画像URLもそのままでいいので簡単ですよ。

日	月	火	水	木	金	土
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	31

日

月

火

水

木

金

土

文字に触れると画像が表示する

フォントを一括で指定する

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

最新のコメント

最新のトラックバック

偽善者キツィこのブログ.

格闘技ＮＯ１ブログ

世界チャンピオン関係

格闘技ファン

亀田四兄弟

スポーツ

不思議な世界

日記

スピリチュアル

福祉と教育

心の叫び

日出処の天子

政治・経済

変なおやじに徹底抗戦

メディア・コンテンツ

興味チェック

封鎖したブログ

最新の記事一覧

過去の記事一覧

Yahoo!からのお知らせ

スマートフォンで見る

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