简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > interface Web > tutoriel HTML > le corps du texte

Comment implémenter le HTML en cliquant sur une image pour accéder à une nouvelle page ? (exemple)

藏色散人
Libérer： 2018-09-03 16:56:10
original
103932 Les gens l'ont consulté

Dans notre processus de conception et de développement de sites Web, le besoin de « liens de saut » est le plus courant. Je crois que pour les amis qui ont une certaine compréhension du HTML, il est très simple de réaliser la fonction consistant à cliquer sur un élément et à accéder à un nouveau lien et à une nouvelle page. Par exemple, cliquer sur un bouton pour sauter, ajouter un lien hypertexte vers du texte, etc. peuvent tous être réalisés.

Ainsi, même les novices connaissent la fonction d'ajout d'hyperliens au texte, c'est-à-dire l'ajout d'une balise a à un certain paragraphe de texte. Ensuite, ajoutez simplement la nouvelle adresse à laquelle vous souhaitez accéder dans la balise a. Même si vous ne le comprenez pas entièrement, vous pouvez toujours l'utiliser facilement à condition de suivre la gourde et de tirer la cuillère.

Mais certains novices peuvent demander s'ils savent écrire, alors HTML cliquez sur l'image pour passer à une nouvelle pageComment implémenter cette fonction ? En fait, cela revient toujours à ajouter des hyperliens au texte. Cet article vous présentera comment implémenter la fonction HTML consistant à cliquer sur une image pour accéder à une nouvelle page ?

Ci-dessous, nous utilisons un exemple de code HTML simple : 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>HTML点击图片跳转页面示例</title>
    <style>
img{width: 80px  ;
height: 80px
;}
     </style>
</head>
<body>
<a href="http://www.php.cn"><img  src="/test/img/2.png" alt="Comment implémenter le HTML en cliquant sur une image pour accéder à une nouvelle page ? (exemple)" > </a>
</body>
</html>
Copier après la connexion

Le code ci-dessus peut être directement copié et collé pour des tests locaux. L'effet de mes tests locaux est le suivant :

.

Comment implémenter le HTML en cliquant sur une image pour accéder à une nouvelle page ? (exemple)

Comme il s'agit d'une capture d'écran, je ne vois pas la page qui sautera après avoir cliqué. Cependant, je l'ai personnellement testé localement. Il passe simplement à la nouvelle adresse de lien "site Web chinois php" que j'ai spécifié. La nouvelle adresse spécifiée après herf dans la balise a. Si vous souhaitez obtenir l'effet de cliquer sur l'image pour accéder à la page, il vous suffit de maîtriser la balise a et la balise img. Voici un petit rappel : le chemin de l'image img doit être correct.

Utilisez ensuite l'article ci-dessus pour introduire le HTML afin de cliquer sur une image pour accéder à une nouvelle page. J'espère que cela aide tout le monde.

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!

Étiquettes associées：
HTML点击图片跳转页面
source：php.cn
Article précédent：Comment écrire du code spatial HTML ? Résumé de l'expression du code spatial HTML Article suivant：Comment mettre en retrait la première ligne avec la propriété CSS text-indent ? 【Explication détaillée】
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
Vanilla JS setTimeout() : identifier un mauvais comportement J'ai une animation sur mon menu hamburger écrite en HTML, CSS et JavaScript vanille. Résul...
Depuis 2024-04-02 20:44:40
0
1
284
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！