各ページの端に固定画像の設置方法(リンク画像) | リアナのカスタマイズ日記(CSS編集用デザイン)

リアナのカスタマイズ日記(CSS編集用デザイン)

アメブロ 新CSS CSS編集用デザイン 無料
カスタマイズ アメブロカスタマイズ 初心者
CSS スタイルシート デザイン
javascript jQuery

★ ページ左上などにリボンなどを貼る方法(リンク画像)
(スクロールしても、ついてこない固定の方法です。)


● フリースペース又は、フリープラグインへ貼ってください。



・左上の場合

<div style="position:fixed;top:0px;left:0px;z-index:100;"><a href="リンク先のURL" target="_blank"><img src="画像のURL"></a></div>



・右上の場合

<div style="position:fixed;top:0px;right:0px;z-index:100;"><a href="リンク先のURL" target="_blank"><img src="画像のURL"></a></div>



・左下の場合

<div style="position:fixed;bottom:0px;left:0px;z-index:100;"><a href="リンク先のURL" target="_blank"><img src="画像のURL"></a></div>



・右下の場合

<div style="position:fixed;bottom:0px;right:0px;z-index:100;"><a href="リンク先のURL" target="_blank"><img src="画像のURL"></a></div>



注意 この方法では、HTML内に style でCSSを指定しています。