ぷよよーん流基本のタグ教室

ぷよよーん流基本のタグ教室

このページはまずはじめに覚える事を
この僕、ぷよよーんが自分流での説明方法で
解説しているページです。
括弧の＜＞は半角で表記して下さい。

beige	black	blue	brown	coral
cyan	gold	gray	green	hotpink
indigo	khaki	lime	orange	pink
plum	purple	red	salmon	silver
skyblue	tan	tomato	white	yellow

まず最初は
文字の大きさと色について覚えましょう！

●文字の大きさについて●
基本（標準）は３の大きさです。
ですから小さくしたい場合は１か２にすればいい。
大きくしたい場合は４、５、６、７の大きさにすればいいわけです。
★表記方法★
＜font size=4＞文字＜/font＞
上記は文字が４の大きさに表示させる表記です。
するとこのように文字になります。

●文字の色について●
楽天の場合は基本デザインで設定している文字色の色になります。
もし変えたければこの表記をすればいいわけです。
文字は色を英語で表記するのが簡単ですが
微妙な色を表記する場合は１６進数（０からＦ）を使った
＃ＲＲＧＧＢＢという色の三原色による指定も出来ます。
★表記方法★
＜font color=red＞文字＜/font＞
上記は文字が赤い文字で表示させる表記です。
文字の大きさと色は同じ括弧の中に表記できます。
するとこのように文字になります。
★表記方法★
＜font size=5 color=blue＞文字＜/font＞
上記は文字の大きさが５で色は青の表示をさせる表記です。
するとこのように文字になります。

beige black blue brown coral

cyan
gold gray green hotpink

indigo
khaki lime orange pink

plum
purple red salmon silver

skyblue
tan tomato white yellow

他にも文字を修飾する方法があります！
文字を太くするには＜b＞文字＜/b＞
文字を斜めに傾いた文字の斜体にするには＜i＞文字＜/i＞
文字にアンダーライン（下線）をつけるには＜u＞文字＜/u＞
あまり使いませんが取り消し線をつけるには＜s＞文字＜/s＞

次は
文字の配列について覚えましょう！
●文字の配列（位置）について●
文字の位置を表記するタグは３つあります。
左揃えと中央揃えと右揃えです。
これは他のデータにも応用できます。
例えば、文字はもちろんですが他にテーブル、画像などです。
■左揃え■　文字を左側に表示させる方法です。
★表記方法★
＜p align=left＞文字＜/p＞
上記は文字を左揃えに表示させる表記です。
このようになります↓

文字

■中央揃え■　文字を中央に表示させる方法です。
★表記方法★
＜p align=center＞文字＜/p＞
上記は文字を中央揃えに表示させる表記です。
ただし中央揃えの場合は
＜center＞文字＜/center＞でも表記できます！
このようになります↓

文字

■右揃え■　文字を右側に表示させる方法です。
★表記方法★
＜p align=right＞文字＜/p＞
上記は文字を左揃えに表示させる表記です。
このようになります↓

文字

３番目に覚える事は画像について覚えましょう！
●画像について●
この楽天広場で使える画像は３種類あります。
ｊｐｇ、ｇｉｆ、ｐｎｇ形式の３種類。
画像の倉庫で登録できる物が上記の３種類。
画像の大きさ（サイズ）が２００キロバイトまでの大きさのものが
画像の倉庫で登録できます。
２００キロバイト以内に縮小するにはこのソフトがお徳です！
この日記本文中で紹介していますのでリンク先のサイトからダウンロードしてね！
画像の倉庫で登録した画像はいろんなページで使えますね！
トップ、日記、プロフィール、マイオークション、お気に入り、
自分が作ったページ内、壁紙（背景）などに使えます。
画像の倉庫で登録した画像はそのページ内で選択し、表示された画像の下に
画像表記のタグが書いてあると思います！
そのタグはトップ、日記、フリマ出品ページの紹介文、自分の作ったページなど
で使用できます。そのままコピー＆ペーストをすれば表示できます。
他に使用する際はそページの編集リンク先でその画像を選択すればＯＫ！
特にトップ、自分で作ったページ内での使用が多いと思います。
★表記方法★その１（枠あり）
＜IMG SRC=http://plaza.rakuten.co.jp/img/temp/2400/101.gif border=1＞
このようになる→
★表記方法★その２（枠なし）
＜IMG SRC=http://plaza.rakuten.co.jp/img/temp/2400/101.gif border=0＞
このようになる→
画像の倉庫で選択した画像の下のタグをコピーしてきた時に
タグ内に画像の大きさを示す表記があります。
その値を変えると画像の大きさは変わります。
width=数値が横に広がる長さ＝幅、
height=数値が縦に広がる長さ＝高さです。

４番目に覚える事はリンクについて覚えましょう！
●リンクについて●
リンクの貼っていないホームページはあまり役立たないですよね？
リンクのないサイトは扱いづらいというデメリットがあります！
ですからリンクについて十分に理解して下さい！
■リンクの基本的な貼り方■
基本として文字があります！その他に画像やバナーなどあります。
＜a href=http://～リンク先のアドレス＞文字か画像など＜/a＞
★表記方法★（文字編）
＜a href=http://plaza.rakuten.co.jp/corectersl100/＞ぷよよーんの何でもコレクターＨＯＭＥへ＜/a＞
するとこのように文字の下に
下線が入ります→ ぷよよーんの何でもコレクターのＨＯＭＥへ
★表記方法★（画像編）
＜a href=http://plaza.rakuten.co.jp/corectersl100/＞
＜IMG SRC=http://plaza.rakuten.co.jp/img/temp/2400/101.gif＞＜/a＞
するとこのように画像にリンクが貼られます→
★表記方法★（画像編２）
上記の方法の場合、画像に枠線がつきます！
ですから枠線を表示させないようにする場合はborder=0を入れます！
＜a href=http://plaza.rakuten.co.jp/corectersl100/＞
＜IMG SRC=http://plaza.rakuten.co.jp/img/temp/2400/101.gif border=0＞＜/a＞
するとこのように枠線なしの画像でのリンクが貼れます→

▼応用編▲
上記の場合同じウィンドウ（ブラウザ）をそのままリンク先へ
同じウィンドウ（ブラウザ）へ表示させる時の表記方法です！
別ウィンドウ（ブラウザ）を開いて表示させる方法があります！
この場合は文字でも画像でも通用します！
上記のように付け足せばいいわけですが今度はリンク先での事なので
＜a href=＞の括弧の中へ付け足します！
その表記はtarget=_blankです。
★表記方法★
＜a href=http://plaza.rakuten.co.jp/corectersl100/ target=_blank＞
ぷよよーんの何でもコレクターのＨＯＭＥへ＜/a＞
するとこのようになります。
クリックしてみるとわかります→ ぷよよーんの何でもコレクターのＨＯＭＥへ