4人5脚+2ワンコ

A:LINK・A:VISITED・A:ACTIVE・A:HOVERについて

A:LINK{ COLOR: #163D5C; TEXT-DECORATION: NONE; }
A:VISITED{ COLOR: #163D5C; TEXT-DECORATION: NONE; }
A:ACTIVE{ COLOR: #486F8A; TEXT-DECORATION: NONE; }
A:HOVER{ COLOR: #486F8A; TEXT-DECORATION: UNDERLINE; }

LINK:(まだ見ていない状態)
VISITED:(すでに見た状態)
ACTIVE:(クリックされた状態)
HOVER:(マウスポインタを乗せた状態)


12月のテンプレートのリンク色は下のように設定しました。
A:LINK:{ COLOR:#ff00ff ; TEXT-DECORATION: NONE; }
A:VISITED:{ COLOR:#ff00ff; TEXT-DECORATION: NONE; }
A:ACTIVE:{ COLOR:#ff00ff ; TEXT-DECORATION: NONE; }
A:HOVER:{ COLOR:#ff1493 ; TEXT-DECORATION: UNDERLINE; }


{ COLOR: #163D5C; TEXT-DECORATION: NONE; }赤文字について

これは文字の装飾(上線、下線、抹消線)を指定するそうです。
none(指定なし)、underline(下線)、overline(上線)、line-through(抹消線)等の種類があるみたいです。




お試しに↓の設定を入れてみました。
A:LINK:{ COLOR:#000000 ; TEXT-DECORATION: NONE; }
A:VISITED:{ COLOR:#00ff00; TEXT-DECORATION: NONE; }
A:ACTIVE:{ COLOR:#0000ff; TEXT-DECORATION: NONE; }
A:HOVER:{ COLOR:#ff0000; TEXT-DECORATION: UNDERLINE; }


A:LINK:{ COLOR:#000000 ; TEXT-DECORATION: NONE; }
↑これはどこが変わるのか判りませんでした(>_<)。

A:VISITED:{ COLOR:#00ff00; TEXT-DECORATION: NONE; }
ポチッと押した後はこの色で表示されました。↓
d0015773_130988.jpg

A:ACTIVE:{ COLOR:#0000ff; TEXT-DECORATION: NONE; }
ポチッと押す前の色
d0015773_1313059.jpg

A:HOVER:{ COLOR:#ff0000; TEXT-DECORATION: UNDERLINE; }
ポインターをのせたときの色↓。そしてTEXT-DECORATION: UNDERLINEに設定が入っているので下線が付きます。
d0015773_1331811.jpg



この設定でリンク色が変わった部分。
d0015773_13103828.jpg
d0015773_13104966.jpg
d0015773_1310599.jpg
d0015773_13111072.jpg
d0015773_13112274.jpg


※基本的には、両サイドの諸々のリンクも本文中のリンクもカレンダーのリンクもこの設定で色が変わるのだと思うのですが、前記は後にそれぞれの設定が出てきます。そこでリンク色を設定するとそちらの方が優先されるみたいです(あまりよく判っていないので言い切れません^^;)。
by 6coro | 2006-11-20 13:18 | 「バブル」の編集 | Comments(7)
Commented by なお at 2006-11-20 14:23 x
おいらも少し、CSSの練習を始めましたが、やっぱりエキサイトさんのほうがgooよりも変えれる事が多いようです^^;
って言うか、まだ変え方を知らないだけかもしれませんがf(^^;)

今日の記事の内容は、おいらにも理解できました^0^♪

面白くってハマりそうですっ(*^-^*)
Commented by なぎ at 2006-11-20 15:55 x
にゃ~~(^^;
この記事を書くエネルギーすごくない~??
読む前から「おお~!すんげぇ~!」と感動してしまいました。
ブログ人では#alpha(左サイド)#beta(中央)#gamma(右サイド)
それぞれ設定があって、わけわかりません^^;
列を表していることを判明するまでにしばらく悩みましたので・・・。

6coroさんのブログでいちばん不思議なのは、右上の囲みの中に
文字を入れて、スクロールさせているでしょ?
枠をどうやって指定するのか、わかんないです(・∀・)???
こういう工夫があるから、見ている人を楽しませてくれるんですね♪
Commented by 6coro at 2006-11-20 20:16
なおさんへ
>面白くってハマりそうですっ(*^-^*)
ハマってください^人^*。そして、いろんなワザをゲットして私に教えて下さい^人^*。
私はヘタの横好きなので知らないことがいっぱいです(^_^;)。
Commented by 6coro at 2006-11-20 20:21
なぎさんへ
>この記事を書くエネルギーすごくない~??
実はそうでも無いんです(^_^;)。
あっちこっちからコピーしているので自分で打つ文字はそんなに無いんです(^_^;)。

そして、エキサイトにはエキサイトのテンプレート編集をメインにされている方のブログがあって、そこら辺をウロウロして勝手に貰ってきてあっちこっち触っては失敗して今日に至りました(^_^;)。憶えきれないのでメモ帳にワザをコピーして貯めています(^_^;)。頭の中は空っぽです(^^;)。

そうそう、右上の窓のソースを貼ります(*^_^*)。
あの場所はCSSの方じゃなくてHTMLのタグとタグの間に入れてあります。長いのでNO2にしますね。
●のところに文章を入れてみて下さい。
Commented by 6coro at 2006-11-20 20:24
<center><div style="margin:0px 0px 0px 0px"><div style="border-width:1px;border-style:solid;border-color: #ff00ff #ff00ff #ff00ff #ff00ff "><div style="border-width:1px;border-style:solid;border-color: white #ff00ff #ff00ff white "><div style="border-width:8px;border-style:solid;border-color:#ff99ff #ffd1ff #ff99ff #ffd1ff"><div style="border-width:1px;border-style:solid;border-color:#ff00ff white white #ff00ff "><div style="border-width:0px;border-style:solid;border-color:fuchsia fuchsia fuchsia fuchsia"><div style="margin:1px"><marquee direction="up" height="100" width="138" scrollamount="1" style="BACKGROUND-COLOR:#fff8ff;font-size:8pt;color:#ff00ff;text-align:">●</marquee>
</div></div></div></div></div></div></center>

追伸:↑大半の意味を判っていません(^^;)。よそ様からコピーしてカラーの所にいろんな色を入れてお試しした結果が右上になりましたぁ(^0^;)
Commented by ごま at 2006-11-21 12:06 x
これはごまにもちょっと分かった。ちょっぴり嬉しい。
Commented by 6coro at 2006-11-21 12:08 x
気が向いたらよろしかったら一度トライしてみてください♪^^。

闘病記録・子育て雑記・趣味など、後々自分史になれば・・・と綴っています^-^*
by 6coro
通知を受け取る
S M T W T F S
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

イラスト:まるめな