ガレコレ [Garage Collection]
2019年1月6日(日)~13日(日)
トップページ下に、3事業ボタン ■子猫の手
 ブログに力が入ってしまっていつも長文なので、ホームページ部分に辿り着けないとのご指摘を頂きました。おっしゃる通りです。

 そこで、トップページ下に、3事業ボタンを固定で配置しました。ソースを開示しておきますので、このような使い方をされたい方は、参考にしてみて下さい。

--
<div style="position:fixed; bottom:0px; margin:auto; width:100%; max-width:600px; background:#111111;"><a href="http://neconote.jp/index.php?page=5#line1"><img src="/image/gc/sanzui.png" style="width:31%; margin:8px 1%;"></a><a href="http://neconote.jp/index.php?page=6#line1"><img src="/image/gc/neconote.png" style="width:31%; margin:8px 1%;"></a><a href="http://neconote.jp/index.php?page=7#line1"><img src="/image/gc/jujo.png" style="width:31%; margin:8px 1%;"></a></div>
--

●『子猫の手』のホームページ作成において、最下行で、新規登録[HTMLタグ]を選択します。

●ボタン群全体 <div></div>
・position:fixed;で、ページ固定します。
・bottom:0px;で、底から0pxに配置します。
・leftおよびrightは指定せず、margin:auto;で左右の中央揃えになります。
・width:100%; max-width:600px;で、基本的には幅100%表示で、子猫の手の最大幅600pxまでに合わせて表示します。
・heightは、中身に合わせてくれますので、指定しなくて構いません。
・backgroundを指定して下さい。

●ボタン <a><img></a>
・今回はボタンが3つです。
・各ボタンの大きさは、width:31%; margin:8px 1%;としています。marginでボタンを離さないと、Googleモバイルフレンドリーに認定してもらえないからです。
 
お問い合わせ


by Network Communication Note