css - トップバーと名前付きアンカーを修正

Question

position:fixedアンカーリンク（）も含むトップバーがあります<a href="#someid">jdjd</a>。

問題は、ターゲットがビューポートの上部（固定トップバーの後ろ）に配置されることです。

ターゲットがトップバーのすぐ下に表示されるようにブラウザがスクロールするように修正するにはどうすればよいですか？

Answer 1

私の知る限り、きれいな解決策はありません。インラインスクロールバーを使用すると実現できますが、その場合は高さを固定する必要があります。

CSS を使用して見つかった 2 つのソリューション: http://css-tricks.com/hash-tag-links-padding/

それ以外の場合は、JQUERY を使用してユーザーの高さを測定し、それをコンテナー div に入れて、スクロールするのは非常に簡単です。

参照: http://jsfiddle.net/jpGdu/

別の解決策は、要素をパディングトップにリンクすることです（h1などの場合）:)

Answer 2

なぜあなたが反対票を投じられているのかわからない、それは正直な良い質問のようだ.

margin-top固定トップバーの高さに等しいビューポートに を配置します。

http://jsfiddle.net/justiceerolin/KfMLJ/例として