pukiwikiカスタマイズ箇所/2020/AMP-social-shareの実装/ボタン位置固定 の履歴ソース(No.4)

• 履歴一覧
• 差分 を表示
• 現在との差分 を表示
• pukiwikiカスタマイズ箇所/2020/AMP-social-shareの実装/ボタン位置固定 へ行く。
  • 1 (2020-10-19 (月) 14:21:59)
  • 2 (2020-10-19 (月) 14:21:59)
  • 3 (2020-10-19 (月) 14:21:59)
  • 4 (2020-10-19 (月) 14:21:59)
  • 5 (2020-10-19 (月) 14:21:59)
  • 6 (2020-10-19 (月) 14:21:59)
  • 7 (2020-10-19 (月) 14:21:59)

#author("2021-11-29T08:10:55+09:00;2020-10-19T14:21:59+09:00","default:tgoto","tgoto")
&tag(pukiwiki);
[[pukiwikiカスタマイズ箇所/2020/AMP-social-shareの実装]]をさらに、ボタン位置固定にする改装についてのメモです。

スタイルシートで

>.sns{
position: fixed; right: 15px; bottom: 30px;
z-index: 10;
opacity: 0.7;
}

を加えています。

rightとbottomは画面の右辺と底辺からの距離を指定しています。当然画面の左ならleft、天辺ならtopに変えることで対応できます。

z-indexは他の要素でz-indexを使っていないサイトの場合は省略可能です。
opacityはアイコンの透明度の指定ですが、0が完全に透明で1が不透明です。0.7であればうっすら透けています。

#ogpi(https://oncologynote.com/?ed13e08e9b)