Salut,
Je ne sais pas si ça a déjà été ajouté, mais je viens de m'amuser à créer des flèches en CSS.
Le gros avantage non négligeable est l'économie de requêtes HTTP par rapport aux flèches en images.
Le code :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4 <span id="s1"></span> <span id="s2"></span> <span id="s3"></span> <span id="s4"></span>
Code css : 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
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36 body { background : #fff; } span { border-color : #fff; border-style : solid; height : 0; overflow : hidden; display : inline-block; margin : 20px; clear : both; } #s1 { border-top-width : 7px; border-bottom-width : 7px; border-left-width : 10px; border-left-color : #abc; } #s2 { border-left-width : 7px; border-right-width : 7px; border-top-width : 10px; border-top-color : #abc; } #s3 { border-top-width : 7px; border-bottom-width : 7px; border-right-width : 10px; border-right-color : #abc; } #s4 { border-left-width : 7px; border-right-width : 7px; border-bottom-width : 10px; border-bottom-color : #abc; }
Le résultat est visible à cette adresse :
http://josselin.willette.free.fr/cod...s/fleches-css/
Partager