じろゃん（*＾､＾）ﾉのブログ一覧

足あとを辿っていたら、白梅さんのブログから
ガシさんのこんなブログに辿りつきました。

☆みんカラにアクセスカウンタを設置しよう☆

うはー
凄いよこれ。めちゃ分かりやすい！
僕は８分で完成ｗｗｗ

そっかー
みんヘルもこうやって書けばよかったのか･･･orz

---

上記の解説ブログは既に追記がなされていますが、
もともとの解説どおりでは規約違反になるようです。

結果的には 忍 SHINOBI.JP の粋な取り計らいにより、
右下のリンク集内に SHINOBI.JP のリンクを追記すれば
いいということになったそうです。

たった今、エムケーさんから指摘されて気付いたんですが、
「お知らせ」の冒頭にある

サーバー増強の影響により、一時的に画像が非表示になる場合がありますが、自動的に復旧しますのでご安心ください。2005年10月21日 New!

のせいで、もしかしたら掲示板を利用した画像のURLが変更されて
いるかも知れません。

僕のブログの中でも、いくつかの写真が表示されていませんでした（ＴＴ）

「自動的に復旧」というのが、元のURLに戻してくれるのならいいのですが、
もしかしたら画像のURLを手直しする必要があるかも知れません。

---

追記

元に戻してくれそうもないので、修正しました。（ＴＴ）
表示されてない画像は、「3」一文字だけ追加すればいいみたい。
一部の画像を違うサーバーに振り替えたみたいね。

　http://carview.r3h.net/images.carview.co.jp/～～.jpg
　　　　　　　↓
　http://carview.r3h.net/images3.carview.co.jp/～～.jpg

ま、最近のみんカラは頑張ってると思うんで、マケとく。

前回は文字に色を付けてみました。
簡単だったでしょ？
みなさん特に問題もなく実現できていたようです。（・∀・）


さて今回は「遊んでみる」と題してみました。

こんなこともできるんだよ、ってのをいくつか紹介しますね。
あまり薦められない感じもしますけど(-ω-；)

---

文字を流してみる

みんカラをサーフィンしてると、たまに見かけますね。
何だか知らないけど、文字がツツゥーーって流れてるヤツ。

こんなヤツです。♪～(￣。￣)

これは <marquee> というタグを使います。
でも Internet Explorer 独自（FirefoxでもOKでしたが）のタグなので、
ネットスケープとかでは左端に止まって見えるようです。

使い方は、いたって簡単。
流したい文字の前に <marquee> 後ろに </marquee> を挿入するだけ。

例えば、<marquee>文字が流れるぅ～～</marquee> をブログに書くと、

文字が流れるぅ～～

と表示されます。簡単でしょ？ （・∀・）


属性もいくつかあるんですが、代表例として、

<marquee width="50%">半分だけ～(*´∇｀*)</marquee>
半分だけ～(*´∇｀*)

<marquee behavior="alternate">(-ω-；) 往復～ （￢_￢）</marquee>
(-ω-；) 往復～ （￢_￢）

<marquee direction="right">逆向きぃ～ ⇒</marquee>
逆向きぃ～ ⇒

なんてこともできます。


ただね・・・
サーフィンしてて見つけたんですが、殆ど全てのブログに<marquee>を使ってる
方がいらっしゃったんですよ。
僕ね、５秒で画面酔いしました。(´Д｀；)

読んでもらえないブログを書くってのも考えモノですので、適度にね。



（追記）
　　330武さんがやってましたが、画像も流れるんですよ。
　　試してみてねっ♪

---

文字に影を付けてみる

これは、あんまり見かけないですね。
実は文字に影を付けることができるんです。

例えば、 とか とか。
僕のブログじゃ目立たない、かな？

これは説明するよりも、具体例を見て頂いた方が早いでしょうね。

<div style="width:100%; filter:DropShadow(color=green,offX=5,offY=-5)">こんな影をつけることができます</div>
　　↓


<div style="width:100%; filter:Shadow(color=red,direction=45)">こういう影もつけられますよ</div>
　　↓

---

ま、ちょっとしたお遊びとして、いかが？

あぁ、いつになったらテーブルのことを書くんだろ？

うん。ま、いっすね。
そのうち書きますよ、きっと。
もしかしたら樹☆くんが書いてくれるかも知れんし。（＾＾）

---

さて今回は「文字修飾 ～文字の色を替える～」ってことにしました。

今までは、みんカラが用意してくれたボタンを使った文字の修飾だったわけですが、
今回は違いますっ！
自分でタグを打つんですっ！

なので、これは中級編です。(｀･ω･´)ｂ

---

では、手始めに文字の色を替えてみましょうか。
敢えて「変えて」ではなく「替えて」と書いたところにミソがあったりします。

というのは、実はこの方法は推奨はされてはいません。
見た目に関しては「スタイルシート」で変更しなさい、とされているんですね。

スタイルシート・・・
ご存知の方も大勢いらっしゃるでしょうし、多くの方がみんカラが用意している
様々なスタイルシートに変更していますね。
ご存知ない方も、マイページのメニューの中に「スタイルシート」っていうのがある
ことぐらいは知ってるでしょうか。


例えば、上記のように「替えて」を赤くしましたよね。
んで、僕が気が変わってブログの欄の背景を「赤」に変えちゃったらどうなるでしょう？

そうですね、当然書いた文字は見えなくなっちゃうわけです。
それを昔のブログに遡って、いちいち変更するなんて気が遠くなってしまいます。

---

とまぁゴタクを並べましたが、そういった理由で僕自身はフォントの色を替えたことが
ないんですね（ブログでは）。

でも、それはそれ、これはこれ。
替えてみたい時は、替えてみたいのサッ！(^∀^；


では具体的に。

簡単に文字の色を替えるには <font> というタグを用います。
この <font> タグを用いると、

• 文字の色
• 文字の大きさ
• フォント種

を替える事ができます。
（Netscapeに対してのみ、もうちょっと別の項目もありますけど）

ただ、文字の大きさに関してはボタンが用意されてますし、フォントの種類は
正直替えないほうが見やすいと思いますので、色だけに特化しますね。


色を替えたい文字の前後に、このようなタグを挿入します。

　　<font color="red">この文字は赤です</font>

これを実際にブログに書くと、

　　この文字は赤です

となります。簡単でしょ？ （・∀・）


このように、<font color="～"> で色を指定し、最後に </font> で
元の色に戻しています。

はい、コレッ！
「元の色に戻している」ということは、「元の色がある」ということですよね。
じゃあ、元の色って何？

僕のブログの場合、今のところ文字は灰色で表示されています。
この「ブログの文字は灰色」っていうのが、実はスタイルシートに記述されて
いるんですね。
だから、<font color="～"> で指定しない限り文字は灰色で表示されるし、
</font> で元の色、つまり灰色に戻るんです。

つまり僕は、文字の色を灰色から赤に「替えて」、後で「元に戻した」んです。

---

いかん、いかん。
相変わらずゴタクが多くなってきた。すんまそ。(´-ω-`)

ともかく、色を替えたい文字の前に <font color="～"> を挿入し、
元の文字の色に戻す所に </font> を挿入しましょう。


あとは、この色を表す"～"ですよね。
ここにはRGB値と呼ばれる赤・緑・青の光の三原色を16進数で表現したものを記述
することもできるのですが、まぁ今回はやめておきましょう。
変な中間色を用いないのであれば、以下の16色があれば充分です。

• ■ Black
• ■ Gray
• ■ Silver
• ■ White
• ■ Red
• ■ Yellow
• ■ Lime
• ■ Aqua
• ■ Blue
• ■ Fuchsia
• ■ Maroon
• ■ Olive
• ■ Green
• ■ Teal
• ■ Navy
• ■ Purple

これらの文字を"～"のところに記述すれば、それぞれの色で表示されますよ。

　　<font color="aqua">水色だ</font> ⇒ 水色だ

---

どうです？ ご理解いただけましたか？

ちなみに まだ説明していない「テーブル」の場合は、ちょっと面倒です。
というのも、<font color="～"> と </font> の間にテーブルを挿入しても、
そのテーブル内の文字には影響を与える事ができません。

ま、それは一応知識として頭の片隅にでも置いておいて頂ければ、と。


では、また次回。

起立、礼！

え～。

次の講義は「テーブル」についてという予定だった
んですが、急遽「文字修飾の基本」に変更しますね。

なぁんて言ってる間に樹☆くんはしっかりと予習
してたりします。（＾＾； ﾏｲｯﾀﾈ

---

今回お話を伺っていると、意外と上↑の写真のボタンを使えていない方が
いらっしゃるようなので、ここで一旦基本に戻ってみようかな、と。

んで。
全ての基本は「文字を選択状態にする」ってことにあります。

文字を選択？
ま、普段からきっとやってることなんでしょうけど、一応おさらいね。


文字を選択状態にするには、大きく２通りのやり方があります。

• マウスで文字をなぞる
• Shiftキーとカーソルキーを併用する

マウスを使う方が大抵簡単なんだけど、思った通りにならないことがあるのも事実。
なので、両方覚えておく方がいいかも。

左の写真で「大抵簡単」って文字を選択するには、
まず先頭（「大抵」のすぐ左）をマウスで左クリックし、
左ボタンを押したまま、マウスを右に動かします。


んで、目的の「大抵簡単」の文字が反転したら
マウスの左ボタンを離します。




この反転した状態を「文字が選択された状態」と言います。

ただね、これが「大抵簡単なんだ」を選択しようと
すると意外と難しいんですよ。
文節を判断してる(させてる)からか、つい行き過ぎて
しまっちゃうんですよね。


そういう時は、もうひとつの方法。
そうです「Shiftキーとカーソルキーの併用」をしてみましょう。

マウスでクリックするでもよし、
カーソルキー(↑・↓・←・→)を使うもよし。
とにかく「大抵」の前にカーソル(縦棒のピコピコ)
を持っていきます。

そこからShiftキーを押しながらカーソルキーの
右(→)を押すたびに１文字ずつ反転される文字
が伸びていきます。


この方法なら「大抵簡単なんだ」だけを選択する事も可能♪

---

さぁこれで、文字を選択状態にすることはできました。
やっとボタンの説明（＾＾；です。
といって、この先は実はやってみる方が早かったりしますね。


［太］ボタン

　このボタンは、選択状態にした文字を太くするボタンです。
　WordやExcelでも Ｂ ってボタンを押すと文字が太く(Boldに)なりますよね。
　あれと同じことです。

　太くしたい文字を選択状態にし［太］ボタンを押すと、その文字の前に<b>、
　後ろに </b>という記号(タグ)が挿入されます。
　・・・これだけ。（＾＾；


［斜］ボタン

　このボタンは、選択状態にした文字を 斜めに するボタンです。
　WordやExcelの Ｉ ボタンと同じです。

　使い方も全く一緒。
　文字を選択状態にして［斜］ボタンを押すだけです。
　<em> と </em> が挿入されます。


［下線］ボタン

　もうお分かりですよね。選択した文字に 下線をつける ボタンです。
　Ｕ ボタンと同じで、使い方も全く同じ。
　<u> と </u> が挿入されます。


［打消］ボタン

　これも同じ。選択した文字に 打ち消し線をつける ボタンです。
　・・・って、こう書いちゃうと間違ってるみたいだけど(^∀^；
　<s> と </s> が挿入されます。


［極大］［大］［小］［極小］ボタン

　これも理屈は一緒です。
　ただこれまでとは違い、挿入されるタグはちょっと長ったらしいものです。
　でも、違いはそれだけ。
　同じように文字を選択状態して、それぞれのボタンを押してみましょう。

　極大
　大
　小
　極小

　タグは <span> というものが使われています。

---

［リンク］ボタン

　これは、ちょっと趣きが違いますね。

　以前の例と同じなのですが「Yahoo!」という文字をクリックしたら
　Yahoo! のホームページが表示されるようにしてみましょう。

　まず Yahoo! という文字を選択状態にします。

　

　ここで「リンク」ボタンを押すとウィンドウが開くので、そこにリンク先の
　アドレスである Yahoo! のURL（http://www.yahoo.co.jp）を入力すればＯＫ。

　←クリック！

　そうすると、こんなややこしい文字列が挿入されます。

　<a href="http://www.yahoo.co.jp" target="_blank">Yahoo!</a>

　ちゃんと正しくリンクが貼れると、

　　　　Yahoo!

　こんな感じになりますよ♪

---

［画像］ボタン

　これは・・・省略しますね（＾＾；
　過去の【みんヘル】を参照してください。

---

［ヘルプミー］ボタン

　これ・・・何ですかね？
　このボタンを押すと、


カービューン

　↑こんなものが挿入されるんですけど・・・
　しかもただ表示されるだけで、リンクも何もしてない・・・

　みんカラのローカルルールか何か？
　知ってる方は教えて下さい。

---

あ、ちなみに、これらのボタンは組み合わせる事ができます。

例えば、ある文字を大きくして斜めにしたければ、文字を選択状態にしておいて
［大］ボタンと［斜］ボタンを押せばＯＫ。

　こんな感じになりますよ。

---

さて、どうでしょうか。
基本編はこのくらいにしますが、お分かりになりました？

では、次回へ。

起立、礼！