固定のヘッダーがアンカー先コンテンツを隠してしまう、これはしばしば問題になることがあります。 この問題にはいくつかの解決策があるので、ここでは5つの解決策を紹介します。実装サイトの参考としてリンクも記載しておきますが、記事を書いた当時のものなので現在の実装とは異なる可能性があることにご注意ください。 1. JavaScript JavaScriptでの実装は説明が不要なのでここでは省略します。画像の高さだったり、考えることもあるのであえてこの方法を使うメリットが思いつかないのであれば、この方法で実装する必要はないはずです。 2. 空の Element を利用する 実際のリンク先にIDを付与するのではなく空の別の要素を置いておいて、それを絶対配置で飛ばしておく方法になります。
![固定のヘッダーがアンカー先コンテンツを隠してしまう問題](https://cdn-ak-scissors.b.st-hatena.com/image/square/913bf0901f9732bdef6b6160bf721f1e86f72da7/height=288;version=1;width=512/https%3A%2F%2Fhbsnow-og-image.now.sh%2F%25E5%259B%25BA%25E5%25AE%259A%25E3%2581%25AE%25E3%2583%2598%25E3%2583%2583%25E3%2583%2580%25E3%2583%25BC%25E3%2581%258C%25E3%2582%25A2%25E3%2583%25B3%25E3%2582%25AB%25E3%2583%25BC%25E5%2585%2588%25E3%2582%25B3%25E3%2583%25B3%25E3%2583%2586%25E3%2583%25B3%25E3%2583%2584%25E3%2582%2592%25E9%259A%25A0%25E3%2581%2597%25E3%2581%25A6%25E3%2581%2597%25E3%2581%25BE%25E3%2581%2586%25E5%2595%258F%25E9%25A1%258C.png%3Ftheme%3Dlight%26md%3D0%26fontSize%3D100px%26images%3Dhttps%253A%252F%252Fhbsnow.dev%252Fassets%252Fimg%252Flogo%252Ficon.svg)