Comment puis-je corriger les ancres sautant derrière un en-tête fixe en CSS ?

Ajustement de l'ancre HTML pour un en-tête fixe à l'aide de CSS

Lorsque vous travaillez avec des en-têtes fixes, il est courant de rencontrer des situations où des ancres liées au contenu dans le la page saute en haut de la page, masquant le contenu derrière l'en-tête. Pour résoudre ce problème, on peut ajuster le décalage des ancres pour les aligner avec le bas de l'en-tête fixe.

Une solution efficace consiste à utiliser CSS :

1. Attribuer une ancre Classe : Attribuez une classe personnalisée à l'ancre, telle que "ancre."

<a class="anchor">

2. Positionner l'ancre : Stylisez l'ancre pour qu'elle se comporte comme un élément de bloc et positionnez-la de manière relative. En définissant une valeur négative pour top, vous pouvez déplacer l'ancre vers le haut par rapport à sa position réelle sur la page.

a.anchor {
  display: block;
  position: relative;
  top: -250px;
  visibility: hidden;
}

Cet ajustement garantit que l'ancre renvoie toujours au contenu correct, tout en compensant la partie cachée derrière l'en-tête. Notez que la visibilité : cachée ; La propriété est utilisée pour empêcher l'ancre d'être visuellement visible.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!