faire ce menu en XHTML/Css

**mouss4rs** · 14/06/2012, 16h48

Bonjour,

Sachant que je ne suis pas un expert en xhtml/Css, j'aimerais savoir s'il est possible de faire ce type de menu (voir image) ?

Je dois avoué que je ne sais pas comment m'y prendre...

Petite précision:
les cercles devront-être cliquable ainsi que les Intitulé.

**Muchos** · 14/06/2012, 17h37

C'est tout à fait faisable… en réutilisant ton image, par exemple, mais tout à fait faisable

La balise <area> peut être une piste (mais c'est du HTML5).

Sinon, j'imagine qu'en svg, c'est possible.

**Torgar** · 14/06/2012, 18h14

<area></area> est aussi valide en HTML 4 en passant

Après on peut éventuellement le faire avec <canvas></canvas> (HTML 5 pour le coup) et un poil de javascript.

**Muchos** · 14/06/2012, 18h52

<area></area> est aussi valide en HTML 4 en passant

Anéfé ! Et donc en xhtml aussi

Sinon, plusieurs images placées avec css peuvent faire l'affaire. Mais j'imagine que la question implique « sans image » !

**NoSmoking** · 14/06/2012, 20h15

Bonjour,
avec un peu de mise en place et des ronds via border-radius, c'est jouable...

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!DOCTYPE HTML>
<html lang="fr">
<head>
<title>[...]</title>
<style type="text/css">
#rond{
  height:40px;
  width:40px;
  border:1px solid red;
  border-radius:20px;
}
#rond:hover{
  background-color:yellow;
}
</style>
</head>
<body>
<div id="rond"></div>
</body>
</html>

**mouss4rs** · 15/06/2012, 09h11

Non pas de HTML 5.
la societé dans laquel je travaille utilise la version 7 d'IE.
Sachant qu'IE7 ne gère pas le HTML5, je n'utiliserais pas de html5.

pour nosmoking: cela m'affiche un carré a trait rouge sur fond blanc.
je ne vois pas de rond ??