A voir également:
- Html arrondir les bords
- Editeur html - Télécharger - HTML
- Br html ✓ - Forum Webmastering
- Arrondir js ✓ - Forum Javascript
- Arrondir les bords d'une image powerpoint ✓ - Forum Montage et acquisition vidéo
- Powerpoint SOS ✓ - Forum Photo numérique
2 réponses
Bonjour, le moyen le plus générique de faire des bordures arrondies est l'utilisation d'images.
Maintenant c'est vrai qu'ils existe certaines fonctions CSS, mais relative à certains navigateurs.
Exemple :
{
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 20px;
-webkit-border-bottom-right-radius: 30px;
-webkit-border-bottom-left-radius: 50px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomright: 30px;
-moz-border-radius-bottomleft: 50px;
border-top-left-radius: 10px;
border-top-right-radius: 20px;
border-bottom-right-radius: 30px;
border-bottom-left-radius: 50px;
}
marchera que sous firefox
Maintenant c'est vrai qu'ils existe certaines fonctions CSS, mais relative à certains navigateurs.
Exemple :
{
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 20px;
-webkit-border-bottom-right-radius: 30px;
-webkit-border-bottom-left-radius: 50px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomright: 30px;
-moz-border-radius-bottomleft: 50px;
border-top-left-radius: 10px;
border-top-right-radius: 20px;
border-bottom-right-radius: 30px;
border-bottom-left-radius: 50px;
}
marchera que sous firefox
C'est faux, Safari utilise le préfixe -webkit- donc ça fonctionne pour lui. Quand à Firefox, il utilise, comme son nom l'indique, le préfixe -moz- . Concernant Google Chrome et Opera, il utilise la propriété basique je pense. Puis pourquoi pas : -khtml- pour Linux : apparemment !
Donc, si tu mets :
{
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-khtml-border-radius:5px;
}
C'est okay pour tout le monde, sauf : Internet Explorer. Enfin, comme d'habitude. ;)
Voilà un lien intéressant : https://www.alsacreations.com/tuto/lire/891-coins-arrondis-css-sans-images.html .
Bonne continuation.
Donc, si tu mets :
{
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-khtml-border-radius:5px;
}
C'est okay pour tout le monde, sauf : Internet Explorer. Enfin, comme d'habitude. ;)
Voilà un lien intéressant : https://www.alsacreations.com/tuto/lire/891-coins-arrondis-css-sans-images.html .
Bonne continuation.