Bonjour,
J'aurai voulu savoir comment faire pour appliquer la propriété "border-radius" à une image se trouvant dans une div exécutant cette propriété.
Petite restriction, le lien image ne doit pas être dans le css.
Une idée ?
Merci![]()
Bonjour,
J'aurai voulu savoir comment faire pour appliquer la propriété "border-radius" à une image se trouvant dans une div exécutant cette propriété.
Petite restriction, le lien image ne doit pas être dans le css.
Une idée ?
Merci![]()
pas sur d'avoir tout compris
?
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4 <div syle="border-radius:10px"> <img src="ton_image" style="border-radius:10px;"/> </div>
ton image sera dans une boite au bords arrondie et aura elle même les bords arrondies.
je ne peu pas te dire pourquoi si tu ne me passe pas ton code.
aussi, j'ai écris border-radius pour simplifier, mais cette propriété n'est reconnu telle quelle que par chrome je crois. pour firefox c'est -moz-border-radius et pour safari -webkit-border-radius, elle n'est pas reconnu par IE.
il faut savoir aussi qu'il s'agit d'une propriété css3 pas encore implantée officiellement puisque expérimentale.
Oui, ça je savais
Voici l'HTML :
Le CSS :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5 <nav class="link_menu"> <figure class="link_img"> <img src="images/icon_technocentre.jpg" width="200" height="100" style="-moz-border-radius:3px;"/> </figure> </nav>
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13 .link_menu { -moz-border-radius: 3px; height: 100px; width: 200px; margin-bottom: 20px; } .link_img { height: 100px; width: 200px; -moz-box-shadow: 0 1px 3px black; -moz-border-radius: 3px; }
en effet j'ai testé à nouveau, le border-radius ne fonctionne pas sur les images. j'ai cru que ca avait fonctionné sur mon premier test ou l'image avait de la transparence.
voila la solution que j'ai trouvé à ton problème: ici
si tu n'as qu'une seule image tu peux entrer ça dans le css(mis en cache), mais si tu en as plusieurs ou qu'elles sont appelées via php tu peux toujours le mettre dans le code html, comme dans mon exemple.
met l'image dans un div en background
Vous avez un bloqueur de publicités installé.
Le Club Developpez.com n'affiche que des publicités IT, discrètes et non intrusives.
Afin que nous puissions continuer à vous fournir gratuitement du contenu de qualité, merci de nous soutenir en désactivant votre bloqueur de publicités sur Developpez.com.
Partager