Cours par Webcam

Cours par Webcam

Formateur Web pour adultes depuis plus 11 ans, je vous propose des COURS collectifs par WEBCAM en LIVE pour booster vos connaissances et être autonome dans la création de site.

En savoir plus

Tags base

Page HTML

Tags sémantiques

Tags navigation

Tags mise en page

Tags multimédia

Tags interaction

Tags grouper

Tags tableau

Tags formulaire

Tags universelles

Attributs globaux

Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn

Balise AREA

Rôle

La balise <area> définir la zone cliquable d’une image. Elle se comporte comme un lien

Testez vous-même cette balise

Utilisez Codepen. La source de l’image est fournit par le site lorempixel.com

Remarque : pour relier la carte à l’image, on utilise l’attribut usemap de la balise <img>

Voici le resultat

Dans cette exemple, cliquer sur le chat du milieu pour vous diriger vers le site http://www.ohmycat.fr/

Compatibilité

navigateur-chromenavigateur-firefoxnavigateur-ienavigateur-safarinavigateur-opera

La balise <area> est pris en charge par tous les principaux navigateurs.

Attributs spécifiques

alt
Spécifie la texte alternative à l’image si le navigateur ne l’affiche pas
href
Spécifie la destination du lien
shape
Spécifie la forme de la zone cliquable : circle pour une forme circulaire, rect pour une forme rectangulaire et poly pour une forme polygonale
coords
Spécifie les coordonnées (en pixel) de la zone cliquable :

  • x,y,r pour le cercle (x,y étant la position du centre et r le rayon).
  • x,y,x,y pour une forme rectangulaire (x,y du point en haut à gauche du rectangle et x,y du point en bas à droite du rectangle).
  • x1,y1,x2,y2,x3,y3.. pour une forme polygonale (x,y de chaque point du polygone)

La balise <area> prend aussi en charge les attributs globaux

Voir les autres balises d’intégration

audio– canvas– embed– figcaption– figure– iframe– img– map– object– param– source – track– video

A lire aussi

tutowebdesign

Afficher du contenu au scroll

Afficher du contenu au scroll Voici un effet impressionnant et pourtant très facile à mettre en place sur vos pages. Le principe consiste à faire

Lire »
MegaphoNews - Closer Than Ever

The leading news agency comes to your smartphone.  Download now.

Politique d'utilisation des cookies

En poursuivant votre navigation sur ce site, vous acceptez l’utilisation de cookies. Les cookies nous permettent de personnaliser le contenu, les sorties et d’optimiser notre trafic.