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
10 astuces CSS pour faciliter…
Dans cette formation CSS volume 2, nous allons découvrir 10…
Apprendre le Responsive Design…
Dans cette formation Responsive Design signée Elephorm, vous…
Créer un site One Page complet…
Dans ce tuto vidéo HTML5, CSS3 et jQuery, 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…
Montage HTML/CSS d’une maquette…
Voici une formation dédiée à la découpe et au montage HTML…
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é
Toutes les formations de Simpledev
Témoignage des clients de simpledev
![]()
Tutoriel clair et précis. Continuez ainsi :)
![]()
Tuto sur le codeigniter excellent par contre existe t il un tuto sur la création d'un back office avec codeigniter. Si oui, je suis fortement intéressée...
![]()
Superbes tutos pour apprendre Laravel ! Continue comme ça :D
![]()
Merci beaucoup pour tes tutorial que j'adore :D
![]()
Très bon formateur de bonne qualité. J'aime.
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 (24 votes)
Les avis / Questions des utilisateurs (22)
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é 1390 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 - 16 février 2013)
" Excellent. C'est juste dommage pour le son, qui n'est pas à la hauteur. Mais sinon, très bien. "
(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 "