スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

[ --/-- ] スポンサー広告 | トラックバック(-) | コメント(-)

Q.記事のリンクに触れると凹(凸)むようにしたい[2右]

A.
これをすると、リンクに触れると、「カチッ」という感じにちょっとだけ左下(上)にずれる、つまり凹(凸)むようになります。
スタイルシートを変更するとできます。
以下、変更方法


1.
スタイルシートの23~26行目付近に
a:hover {
color:#666666;
text-decoration:underline;
}

というのがあります。

2.
リンクに触れると凹むようにする場合は1.を…
a:activ,a:hover {
color:#666666;
text-decoration:underline;

position:relative;
top: 2px;
left: 2px;

}
このように赤文字のところ書き加えます。

3.
リンクに触れると凸むようにする場合は1.を…
a:activ,a:hover {
color:#666666;
text-decoration:underline;

position:relative;
bottom: 2px;
left: 2px;

}

このように赤文字のところ書き加えます。

4.
クリックした瞬間だけ凹んだようにし、カチッという感じにちょっとだけずれすようにするには、1.を…
a:hover {
color:#666666;
text-decoration:underline;

position:relative;
top: 2px;
left: 2px;

}
このように赤文字のところ書き加えます。

5.
クリックした瞬間だけ凸んだようにし、カチッという感じにちょっとだけずれすようにするには、1.を…
a:hover {
color:#666666;
text-decoration:underline;

position:relative;
bottom: 2px;
left: 2px;

}
このように赤文字のところ書き加えます。
ズレ幅を大きくする場合は、2px の 23 以上の数字に変更します。

6.
リンクの部分の下線を消したい場合は、1.
text-decoration:underline;text-decoration:none;と変更します。
スポンサーサイト
[ 06/01 ] [記事]2カラムblue 右サイドバー | トラックバック(-) | コメント(-)

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。