Comment créer des Divs cliquables sans JavaScript ?

Divs cliquables sans JavaScript

Créer un div cliquable sans JavaScript pose un défi, car les éléments de bloc comme les divs ne peuvent pas être placés dans des éléments en ligne comme ancres. Pour pallier à cela, une approche astucieuse consiste à utiliser CSS pour créer l'illusion d'un div cliquable.

Solution utilisant CSS et HTML

1. CSS :

   #my-div {
       background-color: #f00;
       width: 200px;
       height: 200px;
   }
   a.fill-div {
       display: block;
       height: 100%;
       width: 100%;
       text-decoration: none;
   }

   Ce CSS définit un div de taille fixe (#my-div) avec un fond rouge. Il définit également un élément d'ancrage (a.fill-div) qui occupera la totalité du div.

2. HTML :

   <div>

   Le HTML crée un div avec un ID « my-div » et un élément d'ancrage à l'intérieur avec une classe « fill-div ». Étant donné que l'élément d'ancrage occupe la totalité du div, cliquer n'importe où dans le div activera le lien href de l'ancre.

En combinant ces éléments CSS et HTML, vous pouvez rendre un div entier cliquable, ce qui donne l'apparition d'un div cliquable sans utilisation de JavaScript.

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!