Ausführliche Erklärung der Verwendung von CSS-Ankerpunkten (Neulinge)

Es gibt zwei Möglichkeiten, CSS-Anker zu verwenden. Ich empfehle die Verwendung der folgenden:

  <a href=&#39;#one&#39;>到达第一个锚点</a>

    <a href=&#39;#two&#39;>到达第二个锚点</a>

    <p id=&#39;one&#39;>我是第一个锚点</p>

    <p id=&#39;two&#39;>我是第一个锚点</p>

Auf diese Weise klicken wir auf das A Link, entsprechend Der DOM-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>

    <p id=&#39;one&#39; style=&#39;margin:top:-100px;padding-top:100px&#39;>

 <p >我是第一个需要滚动的内容</p>

   <p id=&#39;two&#39; style=&#39;margin:top:-100px;padding-top:100px&#39;>

    <p >我是第二个需要滚动的内容</p>

Dadurch wird nach dem Scrollen der Effekt von 200 Pixeln von oben erreicht. Es hat keinen Einfluss auf den Stil der Originalseite

Vielen Dank an alle fürs Lesen, ich hoffe, Sie werden viel davon profitieren.

Dieser Artikel wurde reproduziert von: https://blog.csdn.net/baidu_32519511/article/details/52668834

Empfohlenes Tutorial: „CSS Tutorial“ https://www.php. cn/css -tutorial.html

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung der Verwendung von CSS-Ankerpunkten (Neulinge). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!