Comment inclure une ancre en HTML ?-tutoriel HTML-php.cn

Comment inclure une ancre en HTML ?

WBOY

Libérer： 2023-08-31 15:21:06

avant

861 Les gens l'ont consulté

Comment inclure une ancre en HTML ?

Dans cet article, nous allons effectuer la tâche consistant à inclure des ancres dans HTML. Plongeons dans cet article pour comprendre les ancres en HTML.

L'élément d'ancrage est utilisé pour relier l'ancre source à l'ancre cible. La cible est la ressource à laquelle l'ancre source est connectée, tandis que la source est le texte, l'image ou le bouton qui pointe vers un autre site.

Les hyperliens sont l'une des technologies clés qui font d'Internet une autoroute de l'information.

Pour mieux comprendre comment inclure des ancres en HTML, regardons l'exemple suivant

Exemple 1

Dans l'exemple ci-dessous, nous allons créer un lien Jump Anchor.

<!DOCTYPE html>
<html>
<head>
   <style>
      .main-content {
         height: 90vh;
         text-align: justify;
      }
   </style>
</head>
<body>
   <h2 id="tutorials">Tutorials Point</h2>
   <p class="main-content">
   Tutorials Point originated from the idea that there exists a class of readers who
   respond better to online content and prefer to learn new skills at their own pace
   from the comforts of their drawing rooms.The journey commenced with a single tutorial
   on HTML in 2006 and elated by the response it generated, we worked our way to adding
   fresh tutorials to our repository which now proudly flaunts a wealth of tutorials and
   allied articles on topics ranging from programming languages to web designing to academics
   and much more.</p>
   <p>Click To
      <a href="#tutorials">Jump</a>.
   </p>
</body>
</html>

Copier après la connexion

Lorsque le script ci-dessus est exécuté, une fenêtre de sortie apparaît affichant le texte utilisé dans le script ci-dessus ainsi que la balise d'ancrage mentionnée "Cliquez pour sauter" qui permet à l'utilisateur de passer au début de la page lorsqu'il est enfoncé.

Exemple 2

En considérant le scénario suivant, nous créons un exemple de lien vers une ancre depuis une autre page Web.

<!DOCTYPE html>
<html>
<body>
   <h2 id="Tutorials">TutorialsPoint</h2>
   <p>Tutorials Point originated from the idea that there exists a class of readers
   who respond better to online content and preferto learn new skills at their own
   place from the comforts of their drawing rooms.</p>
   <p>
      <a href="https://www.tutorialspoint.com/market/index.asp">Go To The Course Page.</a>
   </p>
   <p>
      <a href="https://www.tutorialspoint.com/latest/ebooks">Search For Ebooks.</a>
   </p>
</body>
</html>

Copier après la connexion

Lorsque le script est exécuté, il générera une sortie montrant le texte utilisé dans le script ci-dessus et le lien attaché à la page Web à l'aide de balises d'ancrage. Lorsque l'utilisateur clique sur le lien, une nouvelle page s'ouvre.

Exemple 3 : Utiliser JavaScript

Regardez l'exemple ci-dessous où nous allons créer un lien vers javascript.

<!DOCTYPE html>
<html>
<body>
   <a href="javascript:alert('Welcome To TutorialsPoint!');">Click To Execute</a>
</body>
</html>

Copier après la connexion

Lorsque le script donné est exécuté, il fournira une sortie qui inclut un lien placé sur la page Web à l'aide d'une ancre avec le texte "Cliquez pour exécuter".

Si l'utilisateur clique sur le lien, le script se déclenche et l'avertissement "Bienvenue dans Tutorial Point" s'affiche.

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!