Logo GNT
Actualités Tests & Guides Bons Plans
Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11
Entraide Développement Développement Langage PHP Faire de l'ombre aux CSS

Faire de l'ombre aux CSS

20 réponses
Avatar
Guy
Bonjour,

Existe-t il un moyen d'obtenir des effets d'ombre avec les CSS sans
avoir =E0 passer par des images de fond ?

Merci.

Guy
Signaler un problème avec ce contenu

10 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
1 2
Avatar
Olivier Miakinen
Bonjour,

Le 27/07/2010 20:47, Guy a écrit :

Existe-t il un moyen d'obtenir des effets d'ombre avec les CSS sans
avoir à passer par des images de fond ?



Oui, avec CSS3. Ce n'est pas encore standard, mais il y a moyen de
l'obtenir dans quelques navigateurs.

Voir par exemple :
<http://www.alsacreations.com/tuto/lire/910-creer-des-ombrages-ombres-css-box-shadow-text-shadow.html>

Plus généralement :
<http://www.google.fr/search?q=css+shadow>

Cordialement,
--
Olivier Miakinen
Avatar
Guy
On 27 juil, 21:28, Olivier Miakinen <om+ wrote:
Bonjour,

Le 27/07/2010 20:47, Guy a écrit :



> Existe-t il un moyen d'obtenir des effets d'ombre avec les CSS sans
> avoir à passer par des images de fond ?

Oui, avec CSS3. Ce n'est pas encore standard, mais il y a moyen de
l'obtenir dans quelques navigateurs.

Voir par exemple :
<http://www.alsacreations.com/tuto/lire/910-creer-des-ombrages-ombres-... >

Plus généralement :
<http://www.google.fr/search?q=css+shadow>

Cordialement,
--
Olivier Miakinen



Merci ! Je vais regarder ça. Quant est-il de la validation de la page
dans ce cas ?

Guy
Avatar
Olivier Miakinen
Le 27/07/2010 21:39, Guy a cité :

Bonjour,

[...]

Cordialement,
--
Olivier Miakinen





Tu saurais me dire l'intérêt de conserver ça dans ta réponse ?

Merci ! Je vais regarder ça. [Qu'en] est-il de la validation de la page
dans ce cas ?



Tu as 0 % de chance de pouvoir valider les CSS actuellement si tu
utilises des propriétés CSS3 (avec ou sans les préfixes propres aux
navigateurs). Si tu tiens au tampon « valide CSS 2.1 », tu ne peux pas
utiliser d'ombrage.

--
Olivier Miakinen
Avatar
Guy
On 27 juil, 21:48, Olivier Miakinen <om+ wrote:
Le 27/07/2010 21:39, Guy a cité :



>> Bonjour,

>> [...]

>> Cordialement,
>> --
>> Olivier Miakinen

Tu saurais me dire l'intérêt de conserver ça dans ta réponse ?

> Merci ! Je vais regarder ça. [Qu'en] est-il de la validation de la pa ge
> dans ce cas ?

Tu as 0 % de chance de pouvoir valider les CSS actuellement si tu
utilises des propriétés CSS3 (avec ou sans les préfixes propres aux
navigateurs). Si tu tiens au tampon « valide CSS 2.1 », tu ne peux pa s
utiliser d'ombrage.

--
Olivier Miakinen



Oui, c'est bien ce qui me semblait. Mais bon pourquoi se priver d'une
amélioration qui deviendra standard quand le CSS3 sera validé. Merci
pour le "quant", j'ai envoyé trop vite sans me relire ;-)

Je vais regarder aussi les dégradés de couleurs.

Guy
Avatar
Guy
Désolé, encore oublié de supprimer le message précédent dans ma
réponse...
Avatar
SAM
Le 7/27/10 8:47 PM, Guy a écrit :
Bonjour,

Existe-t il un moyen d'obtenir des effets d'ombre avec les CSS sans
avoir à passer par des images de fond ?



avec IE qui sait faire ça beaucoup mieux que n'importe quel navigateur
et depuis longtemps (IE4? IE5?)

Non, en effet, ce n'est pas W3C-iste
et alors ?
à quoi servent les "commentaires conditionnels" ?

Pour du texte, il suffit de le répéter, le second dans son prorpre
conteneur en absolute et légèrement décalé.

<h2 class="ombre">
Hello ! <span>Hello !</span>
</h2>

.ombre { color: #999; position: relative }
.ombre span { color: #000; position: absolute; top: -2px; left: -2px; }

Hein ?
Ha! Oui, ça fait radoti radotage :-(
--
sm
Avatar
Guy
Bonjour,

Ah j'ai eu peur je pensais que c'était l'âge ;-)

Très simple en effet. Tu n'aurais pas un truc aussi pour obtenir des
dégradés de couleur pendant qu'on est là ?

Merci.

Guy
Avatar
Pascale
Olivier Miakinen <om+ écrivait
news:4c4f3346$:

Voir par exemple :
<http://www.alsacreations.com/tuto/lire/910-creer-des-ombrages-ombres-c
ss-box-shadow-text-shadow.html>



Bizarre, il est dit dans le texte que ça ne fonctionne pas avec Opera,
pourtant, ça a bien l'air de.

--
Pascale
Avatar
Guy
Bon, je me suis amusé ici :

http://www.grenault.net/couples.htm

Fonctionne avec Firefox, Google Chrome et Safari.

Il y a juste un coin qui me chiffone : je ne sais comment faire un
angle arrondi à l'intérieur de la jonction du bandeau vertical et du
bandeau horizontal ?

On dirait du web2, enfin, une pâle imitation bien modeste...

Guy
Avatar
Olivier Miakinen
Le 28/07/2010 09:42, Pascale a écrit :

Voir par exemple :
<http://www.alsacreations.com/tuto/lire/910-creer-des-ombrages-ombres-c
ss-box-shadow-text-shadow.html>





Ton nouvelleur coupe les liens. Et le texte cité. Je le remets :
<http://www.alsacreations.com/tuto/lire/910-creer-des-ombrages-ombres-css-box-shadow-text-shadow.html>

Bizarre, il est dit dans le texte que ça ne fonctionne pas avec Opera,
pourtant, ça a bien l'air de.



Peut-être que ça ne fonctionnait pas au moment de la rédaction de
l'article ? Ou bien son auteur n'a simplement pas testé avec Opéra.

--
Olivier Miakinen
1 2