Dans ce tuto CSS en vidéo, vous apprendrez à utiliser CSS 3 et sa propriété border-radius pour arrondir le coin des images ou encore des champs de formulaires.
Jetez un oeil à ces autres tuto CSS 3
Afficher des vidéos en Responsive…
Dans ce tuto CSS en vidéo, nous verrons comment nous pouvons…
Créer une galerie d'images…
Dans ce tuto WordPress, nous allons voir comment ajouter une…
Débuter en HTML5 - CSS3 -…
Cette formation fait partie d'une série sur la programmation…
Créer un Sticky menu qui…
Dans ce tuto vidéo CSS3 et Jquery, en vidéo, nous allons voir…
Créer un site web avec un…
Dans ce tuto jQuery / CSS3, nous allons ensemble, pas à pas,…
Menu déroulant intelligent…
Avec ce tuto CSS 3, apprenez à réaliser un menu déroulant…
Ajouter une bulle d'info enrichie…
Dans ce tuto jQuery en vidéo, nous allons voir comment créer…
Intégrer et Développer un…
Voici une formation complète dédiée à l'intégration et…
Pour vous faire un avis, voici un extrait de quelques secondes. La version complète et téléchargeable de ce tuto CSS 3 de 9 minutes est proposée dans une résolution plus grande que l’extrait suivant :
simpledev
, formateur certifié
Témoignage des clients de simpledev
![]()
Très bon formateur et surtout une incroyable diversité de tuto dans le domaine du développement de site web. J'ai commencé par les tutos concernant le html 5 et CSS3. Ces derniers proposent des sujets très utiles pour dynamiser mon site
![]()
Excellents tutos, très bien expliqués. Les tutos de Simpledev sont très utiles. L'une des choses qui fait la richesses des tutos est le "mélange des langages de programmation". On peut ainsi réaliser des systèmes complexes, avec plusieurs langages !
![]()
Bref j'ai pas besoin de préciser très bon formateur :)
![]()
Excellent Formateur, 5/5 tout y-est: application, contenu, bon son, pédagogie, bonne image, j'ai beaucoup appris en 2 jours de tuto. Parmi les quelques tutoriels que j'ai vu c'est celui qui se démarque. Simpledev. Bravo à lui j'en redemande.
![]()
Quoi dire d'autre ? merci pour tout ;).
Lire les autres témoignages
D'autres tuto de simpledev
La fonction extract ()
Dans ce tuto Php en vidéo, vous apprendrez à vous servir de la fonction extract ()…
Introduction à PDO pour se connecter à MySQL
Dans ce tuto en video, vous apprendrez à vous connecter à Mysql avec l'extension PDO…
Validation de formulaire
Dans ce tuto Jquery en vidéo, nous verrons comment vérifier et valider côté client,…
PDO et les requêtes préparées
Dans ce tuto PHP en vidéo, vous apprendrez à utiliser l'extension PDO de PHP, et les…
Notes attribuées par les utilisateurs (23 votes)
Les avis / Questions des utilisateurs (21)
Donnez votre avis ou posez une question au formateur.
Vous souhaitez commenter ce tuto vidéo ? Créez un compte gratuit. Déjà membre ? Identifiez-vous
Ce tuto en résumé ...
Ce tuto CSS 3 d’une durée de 9 minutes a été téléchargé 1208 fois et a reçu une note moyenne de 4/5.
Ce tuto a été publié le 25 mars 2010 par simpledev, formateur certifié par Tuto.com, ayant reçu une note moyenne de 4,4/5 pour l’ensemble de ses vidéos, dans la catégorie Tuto CSS Astuces.
Ce tuto video vous expliquera étape par étape, toutes les manipulations présentées par le formateur.
Toutes nos vidéos sont visionnées par notre équipe, avant d’être mises en ligne, garantissant ainsi la qualité des produits téléchargés.











(a téléchargé ce tuto - 06 janvier 2012)
" tuto intéressant "
(a téléchargé ce tuto - 04 novembre 2011)
" Très bon tuto simple... "
(a téléchargé ce tuto - 26 octobre 2011)
" Merci "
(a téléchargé ce tuto - 25 octobre 2011)
" Super, justement se que je cherchais comme effet. merci "
(a téléchargé ce tuto - 19 octobre 2011)
" clair, précis, illustré ! "
(a téléchargé ce tuto - 08 juillet 2011)
" h "
(auteur de ce tuto - 07 mai 2011)
" @Papy26
Ah oui j'oubiai, pour que ça fonctionne, il faut que ton image aie une bordure, donc ça te donnerait un code du genre
img{
border: solid 1px #222;
border-radius: 7px;
}
petite astuce si tu veux pas de bordure apparente, met la même couleur pour ta bordure que le fond de la page, t'aura des coins arrondis sur ton image et pas de bordure:) "
(auteur de ce tuto - 07 mai 2011)
" @Papy26
Et bien il suffit de styliser ton image dans ton fichier css.
Par exemple
img{
border-radius: 7px;
}
voilà c'est tout. "
(a téléchargé ce tuto - 07 mai 2011)
" Bonjour
Bravo pour ce tuto. C'est ce qu'il me fallait. Mais, je voudrais tester sur une image ou une photo. Comment faire sans passer par les div et autres...
Merci d'avance
Cordialement "
(a téléchargé ce tuto - 11 mars 2011)
" moi j'ai mis border-radius: 10px; pour ma ma part sous IE8 sa a marcher
Pour IE7 je ne sais pas :)
voila cordialement "
(a téléchargé ce tuto - 24 février 2011)
" tutoriel tres interressant,
merci beaucoup pour ce partage de connaissances,
cordialement,............ "
(a téléchargé ce tuto - 24 février 2011)
" super infos et tutoriel tres interressant..........
juste une question?
Pourquoi ne pas utilisé les spry(nom, validation, etc ) de dreamweaver?
Merci beaucoup car j'ai appris avec le webkit........
Cordialement,........ "
(auteur de ce tuto - 17 décembre 2010)
" La solution c'est que tout les internautes du monde fassent comme moi : Arrêter d'utiliser IE
Ou alors changer l'équipe de développement du navigateur chez Microsoft.... :)
Y'a plein de solutions radicales, mais sinon sans rêver, je pense qu'il faut passer par Javascript (ou photoshop) pour modifier l'apparence des coins sur IE. "
(a téléchargé ce tuto - 17 décembre 2010)
" Effectivement sur http://www.alsacreations.com/tuto/lire/891-coins-arrondis-css-sans-images.html une méthode existe pour IE. Cependant seuls les champs input sur IE7 fonctionne avec cette méthode.. IE8 ne fonctionne pas.
Si quelqu'un à une solution je suis preneur ;)
"
(a téléchargé ce tuto - 01 octobre 2010)
" Merci pour ce tuto mais pour IE il y a une solution ? "
(a téléchargé ce tuto - 09 août 2010)
" salut,
ce tutoriel n 'est pas valable pour l'explorer
"
(a téléchargé ce tuto - 17 mai 2010)
" Merci beaucoup.
C'était justement ce dont j'avais besoin.
;)
"
(a téléchargé ce tuto - 08 avril 2010)
" Je connaissais déja (avec même plus de valeur avant le border-radius) mais j'ai laissé tomber car ça ne marche pas avec internet explorer et malheureusement trop de monde l'utilise. "
(auteur de ce tuto - 30 mars 2010)
" Bonjour Philippe, malheureusement internet explorer ne prend pas encore en compte cette propriété CSS 3, cependant il existe une astuce en javascript qui s'appelle "Roundies", c'est un peu long à expliquer mais tu trouveras des explications à cette adresse : http://www.alsacreations.com/tuto/lire/891-coins-arrondis-css-sans-images.html
Merci. "
(a téléchargé ce tuto - 30 mars 2010)
" Bravo et merci ! pourriez-vous donner le code pour que cela fonctionne aussi sous explorer qui reste quand même très utilisé. Merci d'avance
Philippe "
(a téléchargé ce tuto - 30 mars 2010)
" Merci. Marie "