WP小枝じゃないよ小技集:【その1】リンクでピョコピョコ

07.072015

この記事は1分で読めます

ここにカエル

 

ちょっとお問い合わせをいただいたので、記事にしちゃいます^^

 

特にどってことのない、サイト上のアクセントなんですが。

 

 

 

59

 

この上の画像の上にマウスを置いてみてください。

 

ちょこっと画像が動くでしょう?

 

 

他にもこのサイトのリンクの貼ってあるところ、

文字でも画像でもどこでもいいんですが、

ピョコって動きませんか?

 

 

 

これの方法なんですが、とても簡単なんです。

 

リンクでピョコピョコ

 

WPの管理画面の、「外観」⇛「テーマ編集」⇛「CSS編集」に

以下のソースを書き込んで「スタイルシートを保存」するだけで、OKです^^

(Jetpackを導入の場合。導入していない場合はスタイルシートの最後に書き加えてください。)

 

a:hover {
position: relative;
top: 2px;
left: 2px;
}

 

 

これは、リンクの上にカーソルを合わせると、

元の位置から2px分、ずらして表示するっていうことなんです。

 

なので、当然ですが2pxの値を大きくすると、動きも大きくなります。

 

 

え~と、他にも色々小難しく説明することもあるんですが、

小技なので、ちゃちゃっと短く切り上げます^^;

 

 

まあ、色々数値を変えたり、

top、bottom、left、right

と指定する位置を変えたりして、

遊んでみてくださいねWell Done

 

 

The following two tabs change content below.
WEBデザインとかアフィリエイトとかやってます。 3度のメシよりWEBが好きです。気が付けばネット歴20年w 月間に読むコミックスの量ならだれにも負けない自信があります! ←ジマンになってないwww 兵庫県在住・人妻・主婦・2児(といってももうデカいよ)の母・8匹の猫飼い

HP初心者でも楽々。サイト作成お助けツール


■ 初心者でも自分で更新できる最短ホームページテンプレート
■ サクサクっと綺麗なサイトを作りたいなら=サイト作成システム「SIRIUS」
■ 豊富な素材を組み合わせて簡単にLPが作れる=LP作成用テンプレート【MeVIUS-メビウス-】
■SEOに強い戦略的テンプレート「賢威6.2」。レスポンシブWebデザインにも対応!パンダアップデート・ペンギンアップデートで悩むサイトオーナー様必見のSEOマニュアルが付属!

HPやブログで稼げるようになるためには?


■ブログを育てて未来の資産とする方法=PRIDE(プライド)
■初心者のためのアフィリエイトの教科書=3Mブログサイトアフィリエイト「LUREA plus」ルレアプラス
■もうキーワードで悩まない=オートレンダー 「未来のトレンドキーワードやライバル不在の穴場キーワードがわかるアフィリエイトオールインワンツール!」


関連記事

■スポンサーリンク

■過去記事