Wissen Sie, wie man CSS-Anker verwendet?

Es gibt zwei Möglichkeiten, CSS-Ankerpunkte zu verwenden. Ich empfehle die folgende:

(Empfohlenes Tutorial: CSS-Tutorial)

<a href=&#39;#one&#39;>到达第一个锚点</a>
    <a href=&#39;#two&#39;>到达第二个锚点</a>
    <div id=&#39;one&#39;>我是第一个锚点</div>
    <div id=&#39;two&#39;>我是第一个锚点</div>

Auf diese Weise wird beim Klicken auf den A-Link das entsprechende DOM angezeigt Der Knoten scrollt zum oberen Rand des Fensters.

Aber manchmal besteht unser Bedürfnis nicht darin, dass es an den oberen Rand des Fensters scrollt. Möglicherweise möchten Sie, dass er etwas weiter von der Spitze entfernt ist. Dies kann mit den folgenden Methoden gelöst werden.

<a href=&#39;#one&#39;>到达第一个锚点</a>
    <a href=&#39;#two&#39;>到达第二个锚点</a>
    <div id=&#39;one&#39; style=&#39;margin:top:-100px;padding-top:100px&#39;>
    <div >我是第一个需要滚动的内容</div>
   <div id=&#39;two&#39; style=&#39;margin:top:-100px;padding-top:100px&#39;>
    <div >我是第二个需要滚动的内容</div>

Auf diese Weise können Sie nach dem Scrollen den Effekt von 200 Pixeln von oben erzielen. ohne den Stil der Originalseite zu beeinträchtigen.

Das obige ist der detaillierte Inhalt vonWissen Sie, wie man CSS-Anker verwendet?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!