サイトにジャンプリンク付きの目次を角丸の枠線や透過の背景色のデザインで設けるためにはどうするか
インターネットでジャンプリンク付きの目次を設けたサイトをブログの記事などで良く見かけていた。 僕もブログに長文の記事を載せる際に見出しで細かく区切られているとそれぞれへ向けてジャンプリンク付きの目次を冒頭に設けておくのが素早く移動できて便利だし、訪問者にも好まれそうだとやってみたら気に入ってしまった。 コンテンツが上下に長いほどにジャンプリンク付きの目次がサイトに必要になって来る。 目次 目次のジャンプリンクのHTML 目次の枠線のデザインのCSS 枠線のCSSのサンプルコード 角丸のCSSのサンプルコード 目次の背景色のデザインのCSS 背景色のCSSのサンプルコード 透過のCSSのサンプルコード 目次の中寄せのデザイン ジャンプリンクのHTML 一つのページ内で移動するのも他のページへのリンクと同じで、リンクのaタグを使う。 リンク元のサンプルコード <a href="#heading1"…